Compare Revisions

Template:CustomCSS

Change Revisions

Revision 542215:

Revision 542215 by Jeremie on

Revision 543157:

Revision 543157 by lorchard_mozilla on

Title:
Template:CustomCSS
Template:CustomCSS
Slug:
Template:CustomCSS
Template:CustomCSS
Tags:
"CSS", "ks-fixed"
"CSS", "ks-fixed"
Content:

Revision 542215
Revision 543157
t7    @charset "utf-8"; /* This is a special template used as a cust7    @charset "utf-8"; /* This is a special template used as a cus
>tom CSS for MDN. *//* When editing this stylesheet, please be car>tom CSS for MDN. *//* When editing this stylesheet, please be car
>eful of different writing direction pages like: https://developer>eful of different writing direction pages like: https://developer
>.mozilla.org/he/docs/HTML If you add a custom CSS class, please t>.mozilla.org/he/docs/HTML If you add a custom CSS class, please t
>ry one of the following. 1, Report to the (evil) leader. 2, Write>ry one of the following. 1, Report to the (evil) leader. 2, Write
> a description about the class that you have added to -- https://> a description about the class that you have added to -- https://
>developer.mozilla.org/en-US/docs/Project:Custom_CSS_Classes -- */>developer.mozilla.org/en-US/docs/Project:Custom_CSS_Classes -- */
> /* Used for footnotes in {{PricePointTable}} (footnotes styles s> /* bug 991732: Quick hack to hide the "external link" indicator 
>hould be unified) */ .footnote { vertical-align: super; font-size>where class="ignore-external" */ body article .ignore-external:be
>:60%;} /* Make the 2nd breadcrumbs disappear, only if the page ha>fore { content: ""; } /* Used for footnotes in {{PricePointTable}
>s been regenerated with a modern template */ .column-container #w>} (footnotes styles should be unified) */ .footnote { vertical-al
>ikiArticle .themeUpdated { display:none } /* Used to wrap columns>ign: super; font-size:60%;} /* Make the 2nd breadcrumbs disappear
> that should all be the same height */ .equalColumnHeights { disp>, only if the page has been regenerated with a modern template */
>lay: table; border-collapse: separate; border-spacing: 20px; } .e> .column-container #wikiArticle .themeUpdated { display:none } /*
>qualColumnHeights div { display: table-cell; width: 50%; height:1> Used to wrap columns that should all be the same height */ .equa
>00%; } // Use for large table (.thirdColumn + .***Bg) table#fullw>lColumnHeights { display: table; border-collapse: separate; borde
>idth-table td.thirdColumn { width: 30%; } .greenBg { width: 30%; >r-spacing: 20px; } .equalColumnHeights div { display: table-cell;
>background-color: rgb(128,255,128); } .lightGreenBg { background-> width: 50%; height:100%; } // Use for large table (.thirdColumn 
>color: rgb(220,255,220); } .yellowBg { background-color: rgb(255,>+ .***Bg) table#fullwidth-table td.thirdColumn { width: 30%; } .g
>255,220); } .orangeBg { background-color: rgb(255,160,100); } .re>reenBg { width: 30%; background-color: rgb(128,255,128); } .light
>dBg { background-color: #F66; } /* highlighted (bottom) link in c>GreenBg { background-color: rgb(220,255,220); } .yellowBg { backg
>all-out boxes */ .callout-link-container { position:relative; hei>round-color: rgb(255,255,220); } .orangeBg { background-color: rg
>ght:100%; } .callout-link-wrapper { padding-top:32px; } .callout->b(255,160,100); } .redBg { background-color: #F66; } /* highlight
>link { font-style: italic; font-size: 14px; font-weight: normal; >ed (bottom) link in call-out boxes */ .callout-link-container { p
>display:block; position:absolute; bottom:0; right:0; } /* remove >osition:relative; height:100%; } .callout-link-wrapper { padding-
>left margin from Font Awesome icons inside wiki content; this is >top:32px; } .callout-link { font-style: italic; font-size: 14px; 
>messing up document content */ #wikiArticle i[class^="icon-"] { m>font-weight: normal; display:block; position:absolute; bottom:0; 
>argin-left: 0px; } /* Iframe for live sample centered (Test) */ .>right:0; } /* remove left margin from Font Awesome icons inside w
>centered iframe { display: block; margin: 0 auto;border:none } /*>iki content; this is messing up document content */ #wikiArticle 
> Simulate two columns for landing page, if enough space is availa>i[class^="icon-"] { margin-left: 0px; } /* Iframe for live sample
>ble */ @media (min-width:1050px) { .topicpage-table {display: tab> centered (Test) */ .centered iframe { display: block; margin: 0 
>le; border-collapse: separate; border-spacing: 20px 0 } /* Next l>auto;border:none } /* Simulate two columns for landing page, if e
>ine to remove once the redesign is live: */ .topicpage-table .sec>nough space is available */ @media (min-width:1050px) { .topicpag
>tion:first-of-type { margin-right: 20px; border-right: solid 6px >e-table {display: table; border-collapse: separate; border-spacin
>rgba(212,221,228,0.5); } html[dir="rtl"] .topicpage-table .sectio>g: 20px 0 } /* Next line to remove once the redesign is live: */ 
>n:first-of-type { border-left:solid 6px rgba(212,221,228,0.5); bo>.topicpage-table .section:first-of-type { margin-right: 20px; bor
>rder-right: none; } .landing { display: table-row;} .section { di>der-right: solid 6px rgba(212,221,228,0.5); } html[dir="rtl"] .to
>splay: table-cell; width:50%;} } /* For Landing page boxes; these>picpage-table .section:first-of-type { border-left:solid 6px rgba
> are boxes displayed within columns on landing pages, such as the>(212,221,228,0.5); border-right: none; } .landing { display: tabl
> Community and Related boxes. */ .landingPageBox { width: 100%; p>e-row;} .section { display: table-cell; width:50%;} } /* For Land
>adding: 0px; border-bottom: 1px solid #bbb; margin-bottom: 3px; }>ing page boxes; these are boxes displayed within columns on landi
> .landingPageBox ul { padding-left: 44px; } /* Wide column box */>ng pages, such as the Community and Related boxes. */ .landingPag
> .wideColumnBox { column-width:375px; -moz-column-width:375px; -w>eBox { width: 100%; padding: 0px; border-bottom: 1px solid #bbb; 
>ebkit-column-width:375px; -o-column-width:375px; -ms-column-width>margin-bottom: 3px; } .landingPageBox ul { padding-left: 44px; } 
>:375px;} .wideColumnBoxList li { line-height: 1.5; list-style-typ>/* Wide column box */ .wideColumnBox { column-width:375px; -moz-c
>e: none; padding-left: 0; page-break-inside: avoid; } /* Multi-co>olumn-width:375px; -webkit-column-width:375px; -o-column-width:37
>lumn boxes for lists of longer links; this will adapt based on sc>5px; -ms-column-width:375px;} .wideColumnBoxList li { line-height
>reen width */ .multiColumnList { column-width:250px; -moz-column->: 1.5; list-style-type: none; padding-left: 0; page-break-inside:
>width:250px; -webkit-column-width:250px; -o-column-width:250px; -> avoid; } /* Multi-column boxes for lists of longer links; this w
>ms-column-width:250px;} .multiColumnList li { line-height: 1.5; l>ill adapt based on screen width */ .multiColumnList { column-widt
>ist-style-type: none; padding-left: 0; page-break-inside: avoid; >h:250px; -moz-column-width:250px; -webkit-column-width:250px; -o-
>} /* Multi-column boxes for smaller links, such as API terms */ .>column-width:250px; -ms-column-width:250px;} .multiColumnList li 
>smallMultiColumnList { column-width: 120px; -moz-column-width:120>{ line-height: 1.5; list-style-type: none; padding-left: 0; page-
>px; -webkit-column-width:120px; -o-column-width:120px; -ms-column>break-inside: avoid; } /* Multi-column boxes for smaller links, s
>-width:120px} .smallMultiColumnList li { list-style-type: none; p>uch as API terms */ .smallMultiColumnList { column-width: 120px; 
>adding-left: 0; page-break-inside: avoid; } /* Multi-column box f>-moz-column-width:120px; -webkit-column-width:120px; -o-column-wi
>or smaller text */ .horizFlexboxContainer { display: flex; displa>dth:120px; -ms-column-width:120px} .smallMultiColumnList li { lis
>y: -webkit-flex; flex-flow: column nowrap; -webkit-flex-flow: col>t-style-type: none; padding-left: 0; page-break-inside: avoid; } 
>umn nowrap; justify-content: center; -webkit-justify-content: cen>/* Multi-column box for smaller text */ .horizFlexboxContainer { 
>ter; align-content: center; -webkit-align-content: center; align->display: flex; display: -webkit-flex; flex-flow: column nowrap; -
>items: center; -webkit-align-items: center; flex-direction: colum>webkit-flex-flow: column nowrap; justify-content: center; -webkit
>n; -webkit-flex-direction: column; } div.smallTextMultiColumnBoxH>-justify-content: center; align-content: center; -webkit-align-co
>eading { background-color: #aac; border-radius: 10px 10px 0 0; bo>ntent: center; align-items: center; -webkit-align-items: center; 
>rder: 2px solid #ccc; order: 1; -webkit-order: 1; width: 75%; pad>flex-direction: column; -webkit-flex-direction: column; } div.sma
>ding: 10px; flex: 0 1 auto; -webkit-flex: 0 1 auto; font-weight: >llTextMultiColumnBoxHeading { background-color: #aac; border-radi
>bold; } div.smallTextMultiColumnBoxList { border: 2px solid #ccc;>us: 10px 10px 0 0; border: 2px solid #ccc; order: 1; -webkit-orde
> background-color: #ddf; border-top: 0; border-radius: 0 0 10px 1>r: 1; width: 75%; padding: 10px; flex: 0 1 auto; -webkit-flex: 0 
>0px; width: 75%; padding: 10px; order: 2; -webkit-order: 2; flex:>1 auto; font-weight: bold; } div.smallTextMultiColumnBoxList { bo
> 0 1 auto; -webkit-flex: 0 1 auto; } div.smallTextMultiColumnBoxL>rder: 2px solid #ccc; background-color: #ddf; border-top: 0; bord
>ist ul { column-width:100px; -moz-column-width:100px; -webkit-col>er-radius: 0 0 10px 10px; width: 75%; padding: 10px; order: 2; -w
>umn-width:100px; -o-column-width:100px; -ms-column-width:100px; }>ebkit-order: 2; flex: 0 1 auto; -webkit-flex: 0 1 auto; } div.sma
> div.smallTextMultiColumnBoxList li { list-style-type: none; padd>llTextMultiColumnBoxList ul { column-width:100px; -moz-column-wid
>ing-left: 0; font-size: 80%; } /* For ending "text alongside imag>th:100px; -webkit-column-width:100px; -o-column-width:100px; -ms-
>es" blocks; add this class to the first block that shouldn't be n>column-width:100px; } div.smallTextMultiColumnBoxList li { list-s
>ext to the image */ .endImageWrapping { clear: both; } /* Fancy T>tyle-type: none; padding-left: 0; font-size: 80%; } /* For ending
>able of content for main pages of tutorial*/ .fancyTOC { counter-> "text alongside images" blocks; add this class to the first bloc
>reset: fancyTOC; -moz-columns: 18em; columns: 18em; margin-bottom>k that shouldn't be next to the image */ .endImageWrapping { clea
>: 1em } .fancyTOC .button { display: block; margin-right: 0; marg>r: both; } /* Fancy Table of content for main pages of tutorial*/
>in-bottom: .25em; background-color: #A24C4C; color: #fff; font-si> .fancyTOC { counter-reset: fancyTOC; -moz-columns: 18em; columns
>ze: 1.5em; line-height: 1.5 } .fancyTOC a::before { counter-incre>: 18em; margin-bottom: 1em } .fancyTOC .button { display: block; 
>ment: fancyTOC; content: counter(fancyTOC) ". " } .fancyTOC a::af>margin-right: 0; margin-bottom: .25em; background-color: #A24C4C;
>ter { content: ' »' } .fancyTOC .button:hover, .fancyTOC .button:> color: #fff; font-size: 1.5em; line-height: 1.5 } .fancyTOC a::b
>focus, .fancyTOC .button:active { background-color: #C26C6C } /* >efore { counter-increment: fancyTOC; content: counter(fancyTOC) "
>In index, dim obsolete, deprecated or non-standard element instea>. " } .fancyTOC a::after { content: ' »' } .fancyTOC .button:hove
>d of striking through them */ s.deprecatedElement, s.obsoleteElem>r, .fancyTOC .button:focus, .fancyTOC .button:active { background
>ent, s.nonStdElement { text-decoration: none; opacity: .3 } /* Ad>-color: #C26C6C } /* In index, dim obsolete, deprecated or non-st
>d widgeted index, here adding an HTML5 badge as the bullet of the>andard element instead of striking through them */ s.deprecatedEl
> li element if class="html5" */ div.index.widgeted { -webkit-colu>ement, s.obsoleteElement, s.nonStdElement { text-decoration: none
>mn-width: 10em; -moz-column-width: 10em; columns: 10em } div.inde>; opacity: .3 } /* Add widgeted index, here adding an HTML5 badge
>x.widgeted li { padding-left: 18px } div.index.widgeted li.html5 > as the bullet of the li element if class="html5" */ div.index.wi
>{ background-image: url("/files/3855/HTML5_Badge_16.png"); backgr>dgeted { -webkit-column-width: 10em; -moz-column-width: 10em; col
>ound-repeat: no-repeat; background-position: left 4px } [dir="rtl>umns: 10em } div.index.widgeted li { padding-left: 18px } div.ind
>"] div.index.widgeted li { padding-right: 18px } [dir="rtl"] div.>ex.widgeted li.html5 { background-image: url("/files/3855/HTML5_B
>index.widgeted li.html5 { background-image: url("/files/3855/HTML>adge_16.png"); background-repeat: no-repeat; background-position:
>5_Badge_16.png"); background-repeat: no-repeat; background-positi> left 4px } [dir="rtl"] div.index.widgeted li { padding-right: 18
>on: right 4px } [dir="rtl"] div.index.widgeted span { padding-rig>px } [dir="rtl"] div.index.widgeted li.html5 { background-image: 
>ht:24px } /* Add widgeted index, adding a Webcomponent badge of t>url("/files/3855/HTML5_Badge_16.png"); background-repeat: no-repe
>he li element if class="webcomp" */ div.index.widgeted li.webcomp>at; background-position: right 4px } [dir="rtl"] div.index.widget
>::after { font-family: FontAwesome; content:" \f085";} /* Quickna>ed span { padding-right:24px } /* Add widgeted index, adding a We
>v template styles : https://developer.mozilla.org/en-US/docs/Temp>bcomponent badge of the li element if class="webcomp" */ div.inde
>late:quicknav -------- */ #wikiArticle { position: relative; } .q>x.widgeted li.webcomp::after { font-family: FontAwesome; content:
>uicknav { position: fixed; top: 237px; left: 33px; background: #F>" \f085";} /* Quicknav template styles : https://developer.mozill
>FF; z-index: 1 } .quicknav dl { max-width: 0; max-height: 300px; >a.org/en-US/docs/Template:quicknav -------- */ #wikiArticle { pos
>overflow: auto; margin: 0; padding: 10px 0; border: 1px solid tra>ition: relative; } .quicknav { position: fixed; top: 237px; left:
>nsparent; border-left: none -webkit-transition: border .5s ease .> 33px; background: #FFF; z-index: 1 } .quicknav dl { max-width: 0
>1s, max-width .5s ease .1s, padding .5s linear .1s; -moz-transiti>; max-height: 300px; overflow: auto; margin: 0; padding: 10px 0; 
>on: border .5s ease .1s, max-width .5s ease .1s, padding .5s line>border: 1px solid transparent; border-left: none -webkit-transiti
>ar .1s; -ms-transition: border .5s ease .1s, max-width .5s ease .>on: border .5s ease .1s, max-width .5s ease .1s, padding .5s line
>1s, padding .5s linear .1s; -o-transition: border .5s ease .1s, m>ar .1s; -moz-transition: border .5s ease .1s, max-width .5s ease 
>ax-width .5s ease .1s, padding .5s linear .1s; transition: border>.1s, padding .5s linear .1s; -ms-transition: border .5s ease .1s,
> .5s ease .1s, max-width .5s ease .1s, padding .5s linear .1s } .> max-width .5s ease .1s, padding .5s linear .1s; -o-transition: b
>quicknav dt, .quicknav dd { margin: 0; padding: 0; white-space: n>order .5s ease .1s, max-width .5s ease .1s, padding .5s linear .1
>owrap } .quicknav dt { font-weight: 700 } .quicknav dd + dt { mar>s; transition: border .5s ease .1s, max-width .5s ease .1s, paddi
>gin-top: .5em } .quicknav:hover dl { max-width: 300px; padding: 1>ng .5s linear .1s } .quicknav dt, .quicknav dd { margin: 0; paddi
>0px 20px 10px 10px; border-color: #ECECE7 } .quicknav .showme { d>ng: 0; white-space: nowrap } .quicknav dt { font-weight: 700 } .q
>isplay: block; position: absolute; top: 10px; left: -31px; width:>uicknav dd + dt { margin-top: .5em } .quicknav:hover dl { max-wid
> 30px; font: 2em sans-serif; color: #CCC; text-align: center; bac>th: 300px; padding: 10px 20px 10px 10px; border-color: #ECECE7 } 
>kground: #FFF; border-radius: 5px 0 0 5px; border: 1px solid #ECE>.quicknav .showme { display: block; position: absolute; top: 10px
>CE7; border-right: none } .quicknav:hover .showme { color: #333; >; left: -31px; width: 30px; font: 2em sans-serif; color: #CCC; te
>} .cleared { clear: both } /* This style has problem ! Style attr>xt-align: center; background: #FFF; border-radius: 5px 0 0 5px; b
>ibute of BR element is not work in Kuma */ .clearLeft { clear: le>order: 1px solid #ECECE7; border-right: none } .quicknav:hover .s
>ft } /* ltr page only ? */ span.comment { display:none; } #wikiAr>howme { color: #333; } .cleared { clear: both } /* This style has
>ticle .breadcrumbs { display: block; margin-bottom: 1em } /* The > problem ! Style attribute of BR element is not work in Kuma */ .
>HTML5 landing page has some special-case stuff, handled here */ />clearLeft { clear: left } /* ltr page only ? */ span.comment { di
>* table.html5ArticleToc { border-width: 5px }*/ table.html5Articl>splay:none; } #wikiArticle .breadcrumbs { display: block; margin-
>eToc { border-style: none; border-width: 0; background-color: tra>bottom: 1em } /* The HTML5 landing page has some special-case stu
>nsparent; border-color: transparent; width: 100%;} .html5ArticleT>ff, handled here */ /* table.html5ArticleToc { border-width: 5px 
>oc thead th { padding: .5em 1em } .html5ArticleToc tbody td { ver>}*/ table.html5ArticleToc { border-style: none; border-width: 0; 
>tical-align: middle } .html5ArticleToc ul { margin: 0; padding: 0>background-color: transparent; border-color: transparent; width: 
> } .html5ArticleToc ul li { display: inline; margin: 0 .25em } /*>100%;} .html5ArticleToc thead th { padding: .5em 1em } .html5Arti
> The syntax box: the first one is now used anywhere (DOM, JS, CSS>cleToc tbody td { vertical-align: middle } .html5ArticleToc ul { 
>, ...) The twoparts is used for CSS properties */ pre.syntaxbox {>margin: 0; padding: 0 } .html5ArticleToc ul li { display: inline;
> margin-bottom: 1em; background-color: #ffe; } pre.twopartsyntaxb> margin: 0 .25em } /* The syntax box: the first one is now used a
>ox { margin-bottom: 0; background-color: #ffe; } pre.twopartsynta>nywhere (DOM, JS, CSS, ...) The twoparts is used for CSS properti
>xbox + pre { border-top: none; margin-top: 0 } /* Allow the conte>es */ pre.syntaxbox { margin-bottom: 1em; background-color: #ffe;
>nt of the syntax box to wrap, to prevent horizontal scrolling */ > } pre.twopartsyntaxbox { margin-bottom: 0; background-color: #ff
>pre.syntaxbox code[class*="language-"], pre.twopartsyntaxbox code>e; } pre.twopartsyntaxbox + pre { border-top: none; margin-top: 0
>[class*="language-"] { white-space:pre-line; } table.withoutBorde> } /* Allow the content of the syntax box to wrap, to prevent hor
>r, table.withoutBorder td, table.withoutBorder tr, table.withoutB>izontal scrolling */ pre.syntaxbox code[class*="language-"], pre.
>order th { border: none } td.horizontalLine { border-left: none }>twopartsyntaxbox code[class*="language-"] { white-space:pre-line;
> td.column { border-bottom: none } td.bottomPart { border-top: no> } table.withoutBorder, table.withoutBorder td, table.withoutBord
>ne } /* Use the verticalText class on a table cell to rotate its >er tr, table.withoutBorder th { border: none } td.horizontalLine 
>contents 90° */ td.verticalText { width: 3em; -webkit-transform: >{ border-left: none } td.column { border-bottom: none } td.bottom
>rotate(-90deg); -moz-transform: rotate(-90deg); -o-transform: rot>Part { border-top: none } /* Use the verticalText class on a tabl
>ate(-90deg); transform: rotate(-90deg) } table.blockTable { borde>e cell to rotate its contents 90° */ td.verticalText { width: 3em
>r-collapse: collapse } table.blockTable, table.blockTable td { ma>; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90de
>rgin: 1px; padding: 1px } table.blockTable .verticalColumn { bord>g); -o-transform: rotate(-90deg); transform: rotate(-90deg) } tab
>er-left: none; border-right: none } /* The index page for HTML / >le.blockTable { border-collapse: collapse } table.blockTable, tab
>CSS */ div.index { -webkit-columns: 18em; -moz-column-width: 18em>le.blockTable td { margin: 1px; padding: 1px } table.blockTable .
>; columns: 18em } div.index > span { font-family: Georgia, Tim>verticalColumn { border-left: none; border-right: none } /* The i
>es, 'Times New Roman', serif; font-size: 1.6em } div.index ul, di>ndex page for HTML / CSS */ div.index { -webkit-columns: 18em; -m
>v.index ol { margin-left: 0; padding-left: 0; list-style-type: no>oz-column-width: 18em; columns: 18em } div.index > span { font
>ne } /* Stuff used for the syntax information about CSS, HTML, an>-family: Georgia, Times, 'Times New Roman', serif; font-size: 1.6
>d so forth */ /* ul.cssprop box used by each CSS Property referen>em } div.index ul, div.index ol { margin-left: 0; padding-left: 0
>ce page*/ .cssprop { background-color: rgba(255, 203, 0, 0.1); } >; list-style-type: none } /* Stuff used for the syntax informatio
>[dir="ltr"] .cssprop { clear: left; border-left: 6px solid rgba(2>n about CSS, HTML, and so forth */ /* ul.cssprop box used by each
>55,203,0,0.5); } [dir="rtl"] .cssprop { clear: right; border-righ> CSS Property reference page*/ .cssprop { background-color: rgba(
>t:6px solid rgba(255,203,0,0.5); } .cssprop li { display: table-r>255, 203, 0, 0.1); } [dir="ltr"] .cssprop { clear: left; border-l
>ow; padding: 3px; margin: 0 } .cssprop li dfn { display: table-ce>eft: 6px solid rgba(255,203,0,0.5); } [dir="rtl"] .cssprop { clea
>ll; padding: 0 5px; border-bottom: none; white-space: pre; cursor>r: right; border-right:6px solid rgba(255,203,0,0.5); } .cssprop 
>: inherit } .cssprop li dfn:after { content: ":" } .cssprop li li>li { display: table-row; padding: 3px; margin: 0 } .cssprop li df
> { display: list-item; list-style-type: disc; line-height: 1 } /*>n { display: table-cell; padding: 0 5px; border-bottom: none; whi
> ul.htmlelt box used by each HTML Element reference page */ .html>te-space: pre; cursor: inherit } .cssprop li dfn:after { content:
>elt { display: table; padding: 11px 22px; background-color:rgba(2> ":" } .cssprop li li { display: list-item; list-style-type: disc
>55,149,0,0.1); } [dir="ltr"] .htmlelt { clear: left; border-left:>; line-height: 1 } /* ul.htmlelt box used by each HTML Element re
>6px solid rgba(255,149,0,0.5); } [dir="rtl"] .htmlelt { clear: ri>ference page */ .htmlelt { display: table; padding: 11px 22px; ba
>ght; border-right:6px solid rgba(255,149,0,0.5); } .htmlelt li { >ckground-color:rgba(255,149,0,0.1); } [dir="ltr"] .htmlelt { clea
>display: table-row; padding: 3px; margin: 0; text-align: left } .>r: left; border-left:6px solid rgba(255,149,0,0.5); } [dir="rtl"]
>htmlelt li dfn { display: table-cell; padding: 0 5px; border-bott> .htmlelt { clear: right; border-right:6px solid rgba(255,149,0,0
>om: none; white-space: pre; cursor: inherit } .htmlelt li dfn:aft>.5); } .htmlelt li { display: table-row; padding: 3px; margin: 0;
>er { content: ":" } .htmlelt li li { display: list-item; list-sty> text-align: left } .htmlelt li dfn { display: table-cell; paddin
>le-type: disc; line-height: 1 } /* ul.audionodebox used by each A>g: 0 5px; border-bottom: none; white-space: pre; cursor: inherit 
>udioNode object reference page*/ .audionodebox { display: table; >} .htmlelt li dfn:after { content: ":" } .htmlelt li li { display
>padding: 11px 22px; background-color:rgba(117,195,165,0.1); } [di>: list-item; list-style-type: disc; line-height: 1 } /* ul.audion
>r="ltr"] .audionodebox { clear: left; border-left:6px solid rgba(>odebox used by each AudioNode object reference page*/ .audionodeb
>117,195,165,0.5); } [dir="rtl"] .audionodebox { clear: right; bor>ox { display: table; padding: 11px 22px; background-color:rgba(11
>der-right:6px solid rgba(117,195,165,0.5); } .audionodebox li, .s>7,195,165,0.1); } [dir="ltr"] .audionodebox { clear: left; border
>ummary-box-js li, .summary-box-events li { display: table-row; pa>-left:6px solid rgba(117,195,165,0.5); } [dir="rtl"] .audionodebo
>dding: 3px; margin: 0; text-align: left } .audionodebox li dfn, .>x { clear: right; border-right:6px solid rgba(117,195,165,0.5); }
>summary-box-js li dfn, .summary-box-events li dfn { display: tabl> .audionodebox li, .summary-box-js li, .summary-box-events li { d
>e-cell; padding: 0 5px; border-bottom: none; white-space: pre; cu>isplay: table-row; padding: 3px; margin: 0; text-align: left } .a
>rsor: inherit } .audionodebox li dfn:after, .summary-box-js li df>udionodebox li dfn, .summary-box-js li dfn, .summary-box-events l
>n:after, .summary-box-events li dfn:after { content: ":" } .audio>i dfn { display: table-cell; padding: 0 5px; border-bottom: none;
>nodebox li li, .summary-box-js li li, .summary-box-events li li {> white-space: pre; cursor: inherit } .audionodebox li dfn:after, 
> display: list-item; list-style-type: disc; line-height: 1 } /* h>.summary-box-js li dfn:after, .summary-box-events li dfn:after { 
>ttps://developer.mozilla.org/en-US/docs/Template:HTML:Element_Nav>content: ":" } .audionodebox li li, .summary-box-js li li, .summa
>igation */ table.HTMLElmNav { margin: 1em auto; border-width: 5px>ry-box-events li li { display: list-item; list-style-type: disc; 
> } table.HTMLElmNav th, table.HTMLElmNav td { text-align: center >line-height: 1 } /* https://developer.mozilla.org/en-US/docs/Temp
>} .method { margin-left: 10px; margin-bottom: 2em; margin-top: 1e>late:HTML:Element_Navigation */ table.HTMLElmNav { margin: 1em au
>m } .method > .name { display: block; font-size: 13pt; margin->to; border-width: 5px } table.HTMLElmNav th, table.HTMLElmNav td 
>bottom: .2em } .method > .name > .param: after { content: ">{ text-align: center } .method { margin-left: 10px; margin-bottom
>,"; padding-right: .5em } .method > .name > .param: last-of>: 2em; margin-top: 1em } .method > .name { display: block; fon
>-type: after { content: "" } .method > .name > .param > >t-size: 13pt; margin-bottom: .2em } .method > .name > .para
>.name: after { content: " as "; font-weight: normal } .method &gt>m: after { content: ","; padding-right: .5em } .method > .name
>; .name > .param: not(.required) { font-style: italic } .metho> > .param: last-of-type: after { content: "" } .method > .n
>d > .name > .param: not(.required): before { content: "[" }>ame > .param > .name: after { content: " as "; font-weight:
> .method > .name > .param: not(.required): after { content:> normal } .method > .name > .param: not(.required) { font-s
> "]" } .method > .description { display: block; font-size: 10p>tyle: italic } .method > .name > .param: not(.required): be
>t; color: #444; font-style: italic; margin-bottom: 7px } .method >fore { content: "[" } .method > .name > .param: not(.requir
>> .name > .returns: before { content: " returns "; font-wei>ed): after { content: "]" } .method > .description { display: 
>ght: normal; font-style: italic } .method > .name > .return>block; font-size: 10pt; color: #444; font-style: italic; margin-b
>s { font-weight: 700 } .method > .params { display: block; col>ottom: 7px } .method > .name > .returns: before { content: 
>or: #555 } .method > .params > .param { display: block; mar>" returns "; font-weight: normal; font-style: italic } .method &g
>gin-bottom: 5px } .method > .params > .param > .name { f>t; .name > .returns { font-weight: 700 } .method > .params 
>ont-weight: 700; margin-right: .5em; min-width: 80px; display: in>{ display: block; color: #555 } .method > .params > .param 
>line-block } .method > .params > .param > .description {>{ display: block; margin-bottom: 5px } .method > .params > 
> display: inline-block; width: 300px; vertical-align: top; margin>.param > .name { font-weight: 700; margin-right: .5em; min-wid
>-right: 30px } .method > .params > .param > .type { disp>th: 80px; display: inline-block } .method > .params > .para
>lay: inline-block; width: 150px; vertical-align: top; font-weight>m > .description { display: inline-block; width: 300px; vertic
>: 700 } .method > .params > .param > .type: before { con>al-align: top; margin-right: 30px } .method > .params > .pa
>tent: "Type "; color: #888; font-weight: normal } .method > .p>ram > .type { display: inline-block; width: 150px; vertical-al
>arams > .param > .default { display: inline-block; width: 1>ign: top; font-weight: 700 } .method > .params > .param &gt
>50px; vertical-align: top; font-weight: 700 } .method > .param>; .type: before { content: "Type "; color: #888; font-weight: nor
>s > .param > .default: before { content: "Default "; color:>mal } .method > .params > .param > .default { display: i
> #888; font-weight: normal } /* version compatibility banners and>nline-block; width: 150px; vertical-align: top; font-weight: 700 
> notes */ .geckoVersionNote { background-color: #E0E0FF; backgrou>} .method > .params > .param > .default: before { conten
>nd-image: -moz-radial-gradient(0px 0 45deg, circle farthest-corne>t: "Default "; color: #888; font-weight: normal } /* version comp
>r, #E0E0FF 0%, #F8F8FF 80%); border-left: 5px solid #008 } .gecko>atibility banners and notes */ .geckoVersionNote { background-col
>VersionNote p { padding-left: 4px; border: 0 } .geckoVersionHeadi>or: #E0E0FF; background-image: -moz-radial-gradient(0px 0 45deg, 
>ng { background-color: #008; background-image: -moz-linear-gradie>circle farthest-corner, #E0E0FF 0%, #F8F8FF 80%); border-left: 5p
>nt(left, #008 50%, #e0e0ff 80%); color: #fff; font: 16px/1.7 Verd>x solid #008 } .geckoVersionNote p { padding-left: 4px; border: 0
>ana, Tahoma, sans-serif; margin-top: 0; margin-left: 0; margin-bo> } .geckoVersionHeading { background-color: #008; background-imag
>ttom: 4px; height: 42px } .geckoVersionHeading a:link { color: #d>e: -moz-linear-gradient(left, #008 50%, #e0e0ff 80%); color: #fff
>dd } .geckoVersionHeading a:visited { color: #eee } .geckoVersion>; font: 16px/1.7 Verdana, Tahoma, sans-serif; margin-top: 0; marg
>Heading a:hover, .geckoVersionHeading a:focus { color: #fdd } .ex>in-left: 0; margin-bottom: 4px; height: 42px } .geckoVersionHeadi
>perimentalIcon { display: inline-block; width:4px; height:4px; co>ng a:link { color: #ddd } .geckoVersionHeading a:visited { color:
>lor:orange; background-color:white; border: 3px solid orange; } .> #eee } .geckoVersionHeading a:hover, .geckoVersionHeading a:focu
>nonstandardIcon { display: inline-block; width:8px; height:8px; c>s { color: #fdd } .experimentalIcon { display: inline-block; widt
>olor:red; background-color:red; border: 1px solid red; } .obsolet>h:4px; height:4px; color:orange; background-color:white; border: 
>eIcon { display: inline-block; width:8px; height:8px; color:black>3px solid orange; } .nonstandardIcon { display: inline-block; wid
>; background-color:black; border: 1px solid black; } .deprecatedI>th:8px; height:8px; color:red; background-color:red; border: 1px 
>con { display: inline-block; width:4px; height:4px; color:black; >solid red; } .obsoleteIcon { display: inline-block; width:8px; he
>background-color:white; border: 3px solid black; } /* Used to to >ight:8px; color:black; background-color:black; border: 1px solid 
>create icon-badged APIs inline */ .indexListRow { display: -ms-fl>black; } .deprecatedIcon { display: inline-block; width:4px; heig
>exbox; display: -webkit-flex; display: flex; -webkit-flex-directi>ht:4px; color:black; background-color:white; border: 3px solid bl
>on: row; -ms-flex-direction: row; flex-direction: row; -webkit-fl>ack; } /* Used to to create icon-badged APIs inline */ .indexList
>ex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-just>Row { display: -ms-flexbox; display: -webkit-flex; display: flex;
>ify-content: flex-start; -ms-flex-pack: start; justify-content: f> -webkit-flex-direction: row; -ms-flex-direction: row; flex-direc
>lex-start; -webkit-align-content: stretch; -ms-flex-line-pack: st>tion: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wra
>retch; align-content: stretch; -webkit-align-items: flex-start; ->p: wrap; -webkit-justify-content: flex-start; -ms-flex-pack: star
>ms-flex-align: start; align-items: flex-start; /*width:100%;*/ } >t; justify-content: flex-start; -webkit-align-content: stretch; -
>.indexListTerm { -webkit-order: 0; -ms-flex-order: 0; order: 0; ->ms-flex-line-pack: stretch; align-content: stretch; -webkit-align
>webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webki>-items: flex-start; -ms-flex-align: start; align-items: flex-star
>t-align-self: flex-start; -ms-flex-item-align: start; align-self:>t; /*width:100%;*/ } .indexListTerm { -webkit-order: 0; -ms-flex-
> flex-start; } .indexListBadges { -webkit-order: 0; -ms-flex-orde>order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; f
>r: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex:>lex: 0 1 auto; -webkit-align-self: flex-start; -ms-flex-item-alig
> 0 1 auto; -webkit-align-self: auto; -ms-flex-item-align: auto; a>n: start; align-self: flex-start; } .indexListBadges { -webkit-or
>lign-self: flex-end; padding-left: 6px; margin-right:6px; } .badg>der: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-
>e { position: relative; top: -2px; display: inline-block; cursor:>flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-fle
> default; border: 1px solid #aaa; border-radius: 8px; padding: .1>x-item-align: auto; align-self: flex-end; padding-left: 6px; marg
>em .6em; font-size: 70%; font-weight: 700; height: 1.4em; vertica>in-right:6px; } .badge { position: relative; top: -2px; display: 
>l-align: middle; line-height: 1.3; } .badgeText { -webkit-hyphens>inline-block; cursor: default; border: 1px solid #aaa; border-rad
>: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; } .>ius: 8px; padding: .1em .6em; font-size: 70%; font-weight: 700; h
>banner { display:block; overflow:hidden; font-size: 12px; font-we>eight: 1.4em; vertical-align: middle; line-height: 1.3; } .badgeT
>ight: normal; margin: 10px 0px; padding: 2px 10px; } .bannerHeadi>ext { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: non
>ng { text-align: inherit; font-weight: bold; padding-bottom: 2px;>e; hyphens: none; } .banner { display:block; overflow:hidden; fon
> } .bannerText { text-align: center; font-weight: normal; } .icon>t-size: 12px; font-weight: normal; margin: 10px 0px; padding: 2px
> { padding-left: 3.1em } [dir=rtl] .icon { padding-left: .8em; pa> 10px; } .bannerHeading { text-align: inherit; font-weight: bold;
>dding-right: 3.1em; } .icon:before { content: ""; position: absol> padding-bottom: 2px; } .bannerText { text-align: center; font-we
>ute; left: -2px; top: 50%; margin-top: -1.5em; width: 2.8em; heig>ight: normal; } .icon { padding-left: 3.1em } [dir=rtl] .icon { p
>ht: 2.8em; background: white no-repeat center center; background->adding-left: .8em; padding-right: 3.1em; } .icon:before { content
>size: 2.6em; border-radius: 100%; border: 1px solid #aaa; border->: ""; position: absolute; left: -2px; top: 50%; margin-top: -1.5e
>right: none; box-sizing: border-box; -moz-boxsizing: border-box; >m; width: 2.8em; height: 2.8em; background: white no-repeat cente
>} [dir=rtl] .icon:before { left: auto; right: -2px; border: 1px s>r center; background-size: 2.6em; border-radius: 100%; border: 1p
>olid #aaa; border-left: none; } /* Used for badging obsolete APIs>x solid #aaa; border-right: none; box-sizing: border-box; -moz-bo
> */ .nonstandardBadge { background: linear-gradient(to right, #f0>xsizing: border-box; } [dir=rtl] .icon:before { left: auto; right
>DE00 30%, #f0ff19); color: black; text-shadow: 1px 1px 0 #ddd; } >: -2px; border: 1px solid #aaa; border-left: none; } /* Used for 
>/* Used for badging Gecko minimum version requirements */ .geckoV>badging obsolete APIs */ .nonstandardBadge { background: linear-g
>ersionBadge { background: rgba(117,195,165,0.44); color: black; t>radient(to right, #f0DE00 30%, #f0ff19); color: black; text-shado
>ext-shadow: 1px 1px 0 #ddd; border:5px solid rgba(0,0,0,0.05); } >w: 1px 1px 0 #ddd; } /* Used for badging Gecko minimum version re
>/* Used for badging Firefox minimum version requirements */ .fire>quirements */ .geckoVersionBadge { background: rgba(117,195,165,0
>foxVersionBadge { background-color: #FEDF9E; background-image: li>.44); color: black; text-shadow: 1px 1px 0 #ddd; border:5px solid
>near-gradient(to right, #FEDF9E 30%, #FEF1D4); background-repeat:> rgba(0,0,0,0.05); } /* Used for badging Firefox minimum version 
> no-repeat; background-size: contain; overflow: hidden; color: bl>requirements */ .firefoxVersionBadge { background-color: #FEDF9E;
>ack; text-shadow: 1px 1px 0 #ccc; white-space: nowrap; } .firefox> background-image: linear-gradient(to right, #FEDF9E 30%, #FEF1D4
>VersionBadge a:link { color: black; text-decoration: underline; }>); background-repeat: no-repeat; background-size: contain; overfl
> .firefoxVersionBadge a:visited { color: black; text-decoration: >ow: hidden; color: black; text-shadow: 1px 1px 0 #ccc; white-spac
>underline; } .firefoxVersionBadge a:hover { color: #853; text-dec>e: nowrap; } .firefoxVersionBadge a:link { color: black; text-dec
>oration: none; } .firefoxVersionBadge a:active { color:#858; text>oration: underline; } .firefoxVersionBadge a:visited { color: bla
>-decoration: none; } /* Used for badging APIs not implemented in >ck; text-decoration: underline; } .firefoxVersionBadge a:hover { 
>Firefox */ .unimplementedBadge { background-color: lightpink; col>color: #853; text-decoration: none; } .firefoxVersionBadge a:acti
>or: black; text-shadow: 1px 1px 0 #ddd; border-color: deeppink; }>ve { color:#858; text-decoration: none; } /* Used for badging API
> /* Used for badging non-standard APIs */ .obsoleteBadge { backgr>s not implemented in Firefox */ .unimplementedBadge { background-
>ound: linear-gradient(to right, #FEBCBC 30%, #fffff0); color: bla>color: lightpink; color: black; text-shadow: 1px 1px 0 #ddd; bord
>ck; text-shadow: 1px 1px 0 #ddd; border-color: #f00; } /* Used fo>er-color: deeppink; } /* Used for badging non-standard APIs */ .o
>r badging deprecated APIs */ .deprecatedBadge { background: linea>bsoleteBadge { background: linear-gradient(to right, #FEBCBC 30%,
>r-gradient(to right, #ccccff 30%, #eeeeff); color: #000; text-sha> #fffff0); color: black; text-shadow: 1px 1px 0 #ddd; border-colo
>dow: 1px 1px 0 #ddd; border-color: blue; } /* Used for badging ex>r: #f00; } /* Used for badging deprecated APIs */ .deprecatedBadg
>perimental APIs */ .experimentalBadge { background: linear-gradie>e { background: linear-gradient(to right, #ccccff 30%, #eeeeff); 
>nt(to right, #ffefd9 40%, #fffde0); color: #000; text-shadow: 1px>color: #000; text-shadow: 1px 1px 0 #ddd; border-color: blue; } /
> 1px 0 #ddd; } /* Used for badging privileged APIs */ .privileged>* Used for badging experimental APIs */ .experimentalBadge { back
>Badge { background: linear-gradient(to right, #FFBD19 30%, #ffb20>ground: linear-gradient(to right, #ffefd9 40%, #fffde0); color: #
>0); color: #000; text-shadow: 1px 1px 0 #ddd; } [dir=rtl] .privil>000; text-shadow: 1px 1px 0 #ddd; } /* Used for badging privilege
>egedBadge { background: linear-gradient(to left, #FFBD19 30%, #ff>d APIs */ .privilegedBadge { background: linear-gradient(to right
>b200); } .icon.privilegedBadge:before { background-color: orange;>, #FFBD19 30%, #ffb200); color: #000; text-shadow: 1px 1px 0 #ddd
> background-image: url(https://mdn.mozillademos.org/files/5061/fi>; } [dir=rtl] .privilegedBadge { background: linear-gradient(to l
>refoxos-logo-sm.png); } .sidebar-box { margin-left: 16px; margin->eft, #FFBD19 30%, #ffb200); } .icon.privilegedBadge:before { back
>bottom: 2.5em; border-right: 1px solid #ecf1f3; padding: 12px; ba>ground-color: orange; background-image: url(https://mdn.mozillade
>ckground: #f1f6f8 url("img/toc-bg.png") 0 0 no-repeat; font: 12px>mos.org/files/5061/firefoxos-logo-sm.png); } .sidebar-box { margi
> Verdana, Tahoma, sans-serif } .sidebar-box h2, .sidebar-box h3, >n-left: 16px; margin-bottom: 2.5em; border-right: 1px solid #ecf1
>.sidebar-box h5 { margin-bottom: .5em; font-family: inherit; font>f3; padding: 12px; background: #f1f6f8 url("img/toc-bg.png") 0 0 
>-weight: 700 } .sidebar-box h2 { font-size: 1.5em } .sidebar-box >no-repeat; font: 12px Verdana, Tahoma, sans-serif } .sidebar-box 
>h3 { font-size: 1.1em } .sidebar-box h5 { font-size: .9em } .side>h2, .sidebar-box h3, .sidebar-box h5 { margin-bottom: .5em; font-
>bar-box > ul { float: left; text-align: left; display: block; >family: inherit; font-weight: 700 } .sidebar-box h2 { font-size: 
>padding: 0; margin: auto 0; position: relative } .sidebar-box ul >1.5em } .sidebar-box h3 { font-size: 1.1em } .sidebar-box h5 { fo
>> li { list-style-type: none } .tab-content-box { border-right>nt-size: .9em } .sidebar-box > ul { float: left; text-align: l
>: 1px solid #ecf1f3; margin-left: 16px; padding: 12px; background>eft; display: block; padding: 0; margin: auto 0; position: relati
>: #fff; font: 12px Verdana, Tahoma, sans-serif } .tab-content-box>ve } .sidebar-box ul > li { list-style-type: none } .tab-conte
> h2, .tab-content-box h3, .tab-content-box h5 { margin-bottom: .5>nt-box { border-right: 1px solid #ecf1f3; margin-left: 16px; padd
>em; font-family: inherit; font-weight: 700 } .tab-content-box h2 >ing: 12px; background: #fff; font: 12px Verdana, Tahoma, sans-ser
>{ font-size: 1.5em } .tab-content-box h3 { font-size: 1.1em } .ta>if } .tab-content-box h2, .tab-content-box h3, .tab-content-box h
>b-content-box h5 { font-size: .9em } /* Horizontal tab boxes */ .>5 { margin-bottom: .5em; font-family: inherit; font-weight: 700 }
>htab { margin: 0 auto 1em; display: inline-block; } .htab>ul&g> .tab-content-box h2 { font-size: 1.5em } .tab-content-box h3 { f
>t;li { width: 150px; height: 28px; list-style-type: none; display>ont-size: 1.1em } .tab-content-box h5 { font-size: .9em } /* Hori
>: inline; padding-bottom: 3px; border: 1px solid #ddd; border-rad>zontal tab boxes */ .htab { margin: 0 auto 1em; display: inline-b
>ius: 3px 3px 0 0; padding-top: 5px; text-align: left; font-size: >lock; } .htab>ul>li { width: 150px; height: 28px; list-styl
>13px; font-weight: normal; margin: auto; position: relative; padd>e-type: none; display: inline; padding-bottom: 3px; border: 1px s
>ing-left: 6px; padding-right: 6px; border-bottom: none; opacity: >olid #ddd; border-radius: 3px 3px 0 0; padding-top: 5px; text-ali
>.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=>gn: left; font-size: 13px; font-weight: normal; margin: auto; pos
>50)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50)>ition: relative; padding-left: 6px; padding-right: 6px; border-bo
>; } .htab>ul>li.selected { opacity: 1 !important; -ms-filte>ttom: none; opacity: .5; -ms-filter: "progid:DXImageTransform.Mic
>r: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter>rosoft.Alpha(Opacity=50)"; filter: progid:DXImageTransform.Micros
>: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); border: 1>oft.Alpha(Opacity=50); } .htab>ul>li.selected { opacity: 1 
>px solid #ddd; border-bottom: none; z-index: 10; background-color>!important; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(
>: rgba(234, 239, 242,1) !important; position: relative; font-weig>Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(Op
>ht: bold; } .htab>ul>li>a { cursor: pointer; } .htab>>acity=100); border: 1px solid #ddd; border-bottom: none; z-index:
>ul>li.selected a { color: #000; } .htab>ul { width: 150px; > 10; background-color: rgba(234, 239, 242,1) !important; position
>text-align: left; display: inline; padding: 0; margin: 0 auto; po>: relative; font-weight: bold; } .htab>ul>li>a { cursor:
>sition: relative; top: 0; } .htab>div { background-color: #f1f> pointer; } .htab>ul>li.selected a { color: #000; } .htab&g
>6f8; margin-top: 0; border: 1px solid #ddd; padding: 12px; positi>t;ul { width: 150px; text-align: left; display: inline; padding: 
>on: relative; z-index: 9; word-wrap: break-word; } /* Compatibili>0; margin: 0 auto; position: relative; top: 0; } .htab>div { b
>ty tables */ table.compat-table { border-color: rgba(0,0,0,0); ma>ackground-color: #f1f6f8; margin-top: 0; border: 1px solid #ddd; 
>rgin: 0 } table.compat-table td { padding: 5px; border: 1px solid>padding: 12px; position: relative; z-index: 9; word-wrap: break-w
> rgba(212,221,228,0.25); font-size:12px; background: #fff; vertic>ord; } /* Compatibility tables */ table.compat-table { border-col
>al-align: top; word-wrap: break-word } table.compat-table th, tab>or: rgba(0,0,0,0); margin: 0 } table.compat-table td { padding: 5
>le.compat-table td.header { border:1px solid rgba(212,221,228,0);>px; border: 1px solid rgba(212,221,228,0.25); font-size:12px; bac
> background:none; font-weight:200; font-family:'Open Sans Light',>kground: #fff; vertical-align: top; word-wrap: break-word } table
>sans-serif; font-size:16px; line-height:100%; padding:2px 4px 8px>.compat-table th, table.compat-table td.header { border:1px solid
>; } div.action-driven { display: inline-block; float: none; min-h> rgba(212,221,228,0); background:none; font-weight:200; font-fami
>eight: 8.5em; margin: .8em; box-shadow: .2em .1em .1em #808080; v>ly:'Open Sans Light',sans-serif; font-size:16px; line-height:100%
>ertical-align: top; } div.action-driven > div { font: 400 20px>; padding:2px 4px 8px; } div.action-driven { display: inline-bloc
> 'Bebas Neue', 'League Gothic', Haettenschweiler, Impact, 'Arial >k; float: none; min-height: 8.5em; margin: .8em; box-shadow: .2em
>Narrow', Meiryo, sans-serif; text-transform: uppercase } /* stand> .1em .1em #808080; vertical-align: top; } div.action-driven >
>ard coloring */ .notice.experimental { color: 0; background-color> div { font: 400 20px 'Bebas Neue', 'League Gothic', Haettenschwe
>:rgba(255,203,0,0.5); border-color:rgba(0,0,0,0.05); border-style>iler, Impact, 'Arial Narrow', Meiryo, sans-serif; text-transform:
>:solid!important; border-width:5px!important; } /* New theme acti> uppercase } /* standard coloring */ .notice.experimental { color
>on-driven */ .card-grid > li > span:first-of-type {font-wei>: 0; background-color:rgba(255,203,0,0.5); border-color:rgba(0,0,
>ght: bold} ul.card-grid {list-style-type: none; padding-left: 0;}>0,0.05); border-style:solid!important; border-width:5px!important
> ul.card-grid li {margin-bottom: 25px; padding: 10px;} @media onl>; } /* New theme action-driven */ .card-grid > li > span:fi
>y screen and (min-width:760px) { ul.card-grid { list-style: none >rst-of-type {font-weight: bold} ul.card-grid {list-style-type: no
>outside none; padding-left: 40px; } .card-grid { border-spacing: >ne; padding-left: 0;} ul.card-grid li {margin-bottom: 25px; paddi
>30px 0px; padding-bottom: 25px; } .card-grid > li > span:fi>ng: 10px;} @media only screen and (min-width:760px) { ul.card-gri
>rst-of-type {font-weight: normal} .card-grid > li { background>d { list-style: none outside none; padding-left: 40px; } .card-gr
>-color: rgb(204, 204, 204); background-image: -moz-linear-gradien>id { border-spacing: 30px 0px; padding-bottom: 25px; } .card-grid
>t(center top , rgb(221, 221, 221) 0px, rgb(187, 187, 187) 100%); > > li > span:first-of-type {font-weight: normal} .card-grid
>border-radius: 6px; background-clip: padding-box; box-shadow: 0px> > li { background-color: rgb(204, 204, 204); background-image
> 2px 4px rgba(0, 0, 0, 0.1); display: table-cell; margin: 3px 12p>: -moz-linear-gradient(center top , rgb(221, 221, 221) 0px, rgb(1
>x 20px; padding: 20px; position: relative; vertical-align: top; w>87, 187, 187) 100%); border-radius: 6px; background-clip: padding
>idth: 200px; word-wrap: break-word; z-index: 1; min-height: 130px>-box; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); display: table-
>; } .card-grid > li:before { left: 1px; position: absolute; ri>cell; margin: 3px 12px 20px; padding: 20px; position: relative; v
>ght: 1px; top: 1px; z-index: -1; } .card-grid > li img { float>ertical-align: top; width: 200px; word-wrap: break-word; z-index:
>:left; max-width: 35%; } .double-card { width: 430px !important; > 1; min-height: 130px; } .card-grid > li:before { left: 1px; p
>} .card-grid > li span { display: block; font-family: 'Open Sa>osition: absolute; right: 1px; top: 1px; z-index: -1; } .card-gri
>ns Light',Arial,Helvetica,sans-serif; font-size: 22px; letter-spa>d > li img { float:left; max-width: 35%; } .double-card { widt
>cing: -1px; line-height: 22px; margin-bottom: 12px; } } .card-gri>h: 430px !important; } .card-grid > li span { display: block; 
>d > li { background-color:rgba(234,239,242,0.5); border-radius>font-family: 'Open Sans Light',Arial,Helvetica,sans-serif; font-s
>: 0; box-shadow:3px 3px 0 3px rgba(212,221,228,0.5); background-i>ize: 22px; letter-spacing: -1px; line-height: 22px; margin-bottom
>mage: none; } /*----------------- for Topic page */ table.topicpa>: 12px; } } .card-grid > li { background-color:rgba(234,239,24
>ge-table, table.topicpage-table td, table.topicpage-table tr, tab>2,0.5); border-radius: 0; box-shadow:3px 3px 0 3px rgba(212,221,2
>le.topicpage-table th { border: none } .topicpage-table .section >28,0.5); background-image: none; } /*----------------- for Topic 
>{ padding-right:1em} /* New theme */ dl { margin-bottom: 20px} .c>page */ table.topicpage-table, table.topicpage-table td, table.to
>enter .topicpage-table h2 { font-family: 'Open Sans Light', sans->picpage-table tr, table.topicpage-table th { border: none } .topi
>serif } .topicpage-table ul {padding-left: 20px; } .topicpage2col>cpage-table .section { padding-right:1em} /* New theme */ dl { ma
> { margin: 1em 0; padding: 0 10px; zoom: 1; } .topicpage2col::aft>rgin-bottom: 20px} .center .topicpage-table h2 { font-family: 'Op
>er { content: "."; display: block; height: 0; clear: both; visibi>en Sans Light', sans-serif } .topicpage-table ul {padding-left: 2
>lity: hidden; } .topicpage2col .A, .topicpage2col .B { width: 50%>0px; } .topicpage2col { margin: 1em 0; padding: 0 10px; zoom: 1; 
>; position: relative } .html-ltr .topicpage2col .A, .html-rtl .to>} .topicpage2col::after { content: "."; display: block; height: 0
>picpage2col .B { float: left; left: -10px } .html-ltr .topicpage2>; clear: both; visibility: hidden; } .topicpage2col .A, .topicpag
>col .B, .html-rtl .topicpage2col .A { float: right; right: -10px >e2col .B { width: 50%; position: relative } .html-ltr .topicpage2
>} .topicpage2col h2 { background-image: url('/media/img/icons-sec>col .A, .html-rtl .topicpage2col .B { float: left; left: -10px } 
>tions.png'); background-repeat: no-repeat; margin: 0 0 .25em; pad>.html-ltr .topicpage2col .B, .html-rtl .topicpage2col .A { float:
>ding: 18px 18px 0 65px; min-height: 48px; font: 400 28px/1 'Bebas> right; right: -10px } .topicpage2col h2 { background-image: url(
> Neue', 'League Gothic', Haettenschweiler, Impact, 'Arial Narrow'>'/media/img/icons-sections.png'); background-repeat: no-repeat; m
>, Meiryo, sans-serif; text-transform: uppercase; border: none } .>argin: 0 0 .25em; padding: 18px 18px 0 65px; min-height: 48px; fo
>html-rtl .topicpage2col h2 { padding: 18px 65px 0 18px; } .html-l>nt: 400 28px/1 'Bebas Neue', 'League Gothic', Haettenschweiler, I
>tr .topicpage2col .Documentation { background-position: 0 0 } .ht>mpact, 'Arial Narrow', Meiryo, sans-serif; text-transform: upperc
>ml-ltr .topicpage2col .Community { background-position: 0 -200px >ase; border: none } .html-rtl .topicpage2col h2 { padding: 18px 6
>} .html-ltr .topicpage2col .Tools { background-position: 0 -400px>5px 0 18px; } .html-ltr .topicpage2col .Documentation { backgroun
> } .html-ltr .topicpage2col .Related_Topics { background-position>d-position: 0 0 } .html-ltr .topicpage2col .Community { backgroun
>: 0 -600px } .html-rtl .topicpage2col .Documentation { background>d-position: 0 -200px } .html-ltr .topicpage2col .Tools { backgrou
>-position: right 0 } .html-rtl .topicpage2col .Community { backgr>nd-position: 0 -400px } .html-ltr .topicpage2col .Related_Topics 
>ound-position: right -200px } .html-rtl .topicpage2col .Tools { b>{ background-position: 0 -600px } .html-rtl .topicpage2col .Docum
>ackground-position: right -400px } .html-rtl .topicpage2col .Rela>entation { background-position: right 0 } .html-rtl .topicpage2co
>ted_Topics { background-position: right -600px } /* ------------->l .Community { background-position: right -200px } .html-rtl .top
>--------------- Styles for Indicator */ .inlineIndicator, .indica>icpage2col .Tools { background-position: right -400px } .html-rtl
>torInHeadline, .blockIndicator, .overheadIndicator { /*box-shadow> .topicpage2col .Related_Topics { background-position: right -600
>: 1px 1px 1px #CCC*/ margin: 0px 0px 1.5em; border: 5px solid; pa>px } /* ---------------------------- Styles for Indicator */ .inl
>dding: 10px 10px 0px 10px; background: none repeat scroll 0% 0%; >ineIndicator, .indicatorInHeadline, .blockIndicator, .overheadInd
>font-size: 12px; } .redesign .inlineIndicator, .redesign .indicat>icator { /*box-shadow: 1px 1px 1px #CCC*/ margin: 0px 0px 1.5em; 
>orInHeadline, .redesign .blockIndicator, .redesign .overheadIndic>border: 5px solid; padding: 10px 10px 0px 10px; background: none 
>ator { /* background-color:rgba(255,203,0,0.75); */ border-color:>repeat scroll 0% 0%; font-size: 12px; } .redesign .inlineIndicato
>rgba(0,0,0,0.05); border-style: solid !important; /* font-size: 1>r, .redesign .indicatorInHeadline, .redesign .blockIndicator, .re
>1px; */ padding: 10px; } .redesign .inlineIndicator, .redesign .i>design .overheadIndicator { /* background-color:rgba(255,203,0,0.
>ndicatorInHeadline { border-width: 0; border-left-width: 4px; fon>75); */ border-color:rgba(0,0,0,0.05); border-style: solid !impor
>t-size: 10px; font-family: Helvetica, Arial, sans-serif; min-widt>tant; /* font-size: 11px; */ padding: 10px; } .redesign .inlineIn
>h: 20px; border-radius: 2px; letter-spacing: 1px; padding: 6px 6p>dicator, .redesign .indicatorInHeadline { border-width: 0; border
>x 4px 6px; display: inline-block; vertical-align: top; margin-lef>-left-width: 4px; font-size: 10px; font-family: Helvetica, Arial,
>t: 11px; border-top-width: 0; border-right-width: 0; border-botto> sans-serif; min-width: 20px; border-radius: 2px; letter-spacing:
>m-width: 0; font-weight: normal; line-height: normal; } /* styles> 1px; padding: 6px 6px 4px 6px; display: inline-block; vertical-a
> for inline indicator */ .inlineIndicator /* This class is base o>lign: top; margin-left: 11px; border-top-width: 0; border-right-w
>f inlineIndicator */ , .megaWarningInline { border-width: 1px; bo>idth: 0; border-bottom-width: 0; font-weight: normal; line-height
>rder-style: solid; font-size: 12px; white-space: nowrap; padding:>: normal; } /* styles for inline indicator */ .inlineIndicator /*
> 0 2px; margin: 0 2px } .todoInline { border-left-width: 8px; whi> This class is base of inlineIndicator */ , .megaWarningInline { 
>te-space: normal } .megaWarningInline { background: red; border-c>border-width: 1px; border-style: solid; font-size: 12px; white-sp
>olor: #818151; color: #fff; font-size: small; font-weight: 700; f>ace: nowrap; padding: 0 2px; margin: 0 2px } .todoInline { border
>loat: right; vertical-align: middle; /* Mega warnings: deep red b>-left-width: 8px; white-space: normal } .megaWarningInline { back
>ackgrounds etc */ } .notXPCOMInline, .noscriptInline { font-weigh>ground: red; border-color: #818151; color: #fff; font-size: small
>t: 700 } /* styles for overhead indicator */ /*.overheadIndicator>; font-weight: 700; float: right; vertical-align: middle; /* Mega
> *//* This class is base of overheadIndicator */ , .standardNoteH> warnings: deep red backgrounds etc */ } .notXPCOMInline, .noscri
>eader, .standardNoteBlock { border: 1px solid #000; overflow: hid>ptInline { font-weight: 700 } /* styles for overhead indicator */
>den; margin: 10px 0; padding: 0 10px; text-align: center } /*.ove> /*.overheadIndicator *//* This class is base of overheadIndicato
>rheadIndicator p,*/ .blockIndicator p { margin: 4px 0 } .draftHea>r */ , .standardNoteHeader, .standardNoteBlock { border: 1px soli
>der strong { display: block; padding-top: 10px } .draftHeader div>d #000; overflow: hidden; margin: 10px 0; padding: 0 10px; text-a
> { font-size: x-small; padding-bottom: 10px } html[dir="rtl"] .wa>lign: center } /*.overheadIndicator p,*/ .blockIndicator p { marg
>rningHeader { padding: 1em 130px 1em 1em !important; background-p>in: 4px 0 } .draftHeader strong { display: block; padding-top: 10
>osition: 99% 10px !important; } /* styles for Method indicator */>px } .draftHeader div { font-size: x-small; padding-bottom: 10px 
> .indicatorInHeadline, .standardNoteMethod { border: 1px solid #0>} html[dir="rtl"] .warningHeader { padding: 1em 130px 1em 1em !im
>00; padding: 1px 2px; white-space: nowrap; vertical-align: middle>portant; background-position: 99% 10px !important; } /* styles fo
>; font-size: 12px; float: right; } [dir="rtl"] .indicatorInHeadli>r Method indicator */ .indicatorInHeadline, .standardNoteMethod {
>ne, [dir="rtl"] .standardNoteMethod { float: left; } .renamedMeth> border: 1px solid #000; padding: 1px 2px; white-space: nowrap; v
>od, .noscriptMethod, .deprecatedMethod, .unimplementedMethod { fo>ertical-align: middle; font-size: 12px; float: right; } [dir="rtl
>nt-weight: 700 } /* color setting */ #wikiArticle i.icon-beaker {>"] .indicatorInHeadline, [dir="rtl"] .standardNoteMethod { float:
> color: #09d } /* experimental */ #wikiArticle i.icon-warning-sig> left; } .renamedMethod, .noscriptMethod, .deprecatedMethod, .uni
>n { color: #db0 } /* non-standard */ #wikiArticle i.icon-thumbs-d>mplementedMethod { font-weight: 700 } /* color setting */ #wikiAr
>own-alt { color: #000 } /* deprecated */ #wikiArticle i.icon-tras>ticle i.icon-beaker { color: #09d } /* experimental */ #wikiArtic
>h { color: #d00 } /* obsolete */ #wikiArticle i.icon-stethoscope >le i.icon-warning-sign { color: #db0 } /* non-standard */ #wikiAr
>{ color: darkslateblue } /* unimplemented */ .draft { background:>ticle i.icon-thumbs-down-alt { color: #000 } /* deprecated */ #wi
> #FFC; border-color: #990 } .redesign .draft { background:rgba(25>kiArticle i.icon-trash { color: #d00 } /* obsolete */ #wikiArticl
>5,203,0,0.5); border-color:rgba(0,0,0,0.05); } .htmlVer { backgro>e i.icon-stethoscope { color: darkslateblue } /* unimplemented */
>und: #CEE; border-color: #267373 } .redesign .htmlVer { border-co> .draft { background: #FFC; border-color: #990 } .redesign .draft
>lor:rgba(0,0,0,0.05); } .nonStandard { background:rgba(193,56,50,> { background:rgba(255,203,0,0.5); border-color:rgba(0,0,0,0.05);
>0.85); color:#FFF; border-color:rgba(0,0,0,0.05); } .nonStandard > } .htmlVer { background: #CEE; border-color: #267373 } .redesign
>a, .nonStandard a:hover, .nonStandard a:visited, .warning a, .war> .htmlVer { border-color:rgba(0,0,0,0.05); } .nonStandard { backg
>ning a:hover, .warning a:visited { color: yellow; border-bottom: >round:rgba(193,56,50,0.85); color:#FFF; border-color:rgba(0,0,0,0
>1px solid yellow; text-decoration: none; } .unimplemented { backg>.05); } .nonStandard a, .nonStandard a:hover, .nonStandard a:visi
>round:rgba(193,56,50,0.35); border-color:rgba(0,0,0,0.05); } .dep>ted, .warning a, .warning a:hover, .warning a:visited { color: ye
>recated { background:rgba(0,0,0,0.1); border-color:rgba(0,0,0,0.0>llow; border-bottom: 1px solid yellow; text-decoration: none; } .
>5); } .domLevel { border-color:rgba(0,0,0,0.05); } .todo { border>unimplemented { background:rgba(193,56,50,0.35); border-color:rgb
>-color:rgba(0,0,0,0.05); } .minVer, .jsMinVer, .mbMinVer { backgr>a(0,0,0,0.05); } .deprecated { background:rgba(0,0,0,0.1); border
>ound: #ffffe1; border-color:rgba(0,0,0,0.05); } .mobileOnly { bor>-color:rgba(0,0,0,0.05); } .domLevel { border-color:rgba(0,0,0,0.
>der-color:rgba(0,0,0,0.05); background: #FFE1BE; } .renamed { bac>05); } .todo { border-color:rgba(0,0,0,0.05); } .minVer, .jsMinVe
>kground: #d4f3ff; border-color: #818151 } .projectSpecific { back>r, .mbMinVer { background: #ffffe1; border-color:rgba(0,0,0,0.05)
>ground: #ffe1be; border-color:rgba(0,0,0,0.05); } .prefixBox { ba>; } .mobileOnly { border-color:rgba(0,0,0,0.05); background: #FFE
>ckground: #e4edf7; border-color:rgba(0,0,0,0.05); } .experimental>1BE; } .renamed { background: #d4f3ff; border-color: #818151 } .p
> { background: #ffefd9; border-color:rgba(0,0,0,0.05); } .readOnl>rojectSpecific { background: #ffe1be; border-color:rgba(0,0,0,0.0
>y { background:rgba(0,0,0,0.65); border-color:rgba(0,0,0,0.15); c>5); } .prefixBox { background: #e4edf7; border-color:rgba(0,0,0,0
>olor: #FFF} .noscript { background: red; border-color:rgba(0,0,0,>.05); } .experimental { background: #ffefd9; border-color:rgba(0,
>0.05); color: #FFF } .projectSpecific{ background: #ffe1be; borde>0,0,0.05); } .readOnly { background:rgba(0,0,0,0.65); border-colo
>r-color: #818151; } /* Banner used to indicate support only in sp>r:rgba(0,0,0,0.15); color: #FFF} .noscript { background: red; bor
>ecific Gecko projects */ .translationInProgress { background: #A3>der-color:rgba(0,0,0,0.05); color: #FFF } .projectSpecific{ backg
>F5A3; border-color:rgba(0,0,0,0.05); } /* style for next and prev>round: #ffe1be; border-color: #818151; } /* Banner used to indica
>ious pages in tutorial */ a.nextPage { display: inline-block; mar>te support only in specific Gecko projects */ .translationInProgr
>gin: 0 3px 1em; font-size: 1.25em } a.nextPage:link, a.nextPage:v>ess { background: #A3F5A3; border-color:rgba(0,0,0,0.05); } /* st
>isited { background-color: #069 } a.nextPage:hover, a.nextPage:fo>yle for next and previous pages in tutorial */ a.nextPage { displ
>cus { background-color: #0099E6 } a.nextPage { float:right } [dir>ay: inline-block; margin: 0 3px 1em; font-size: 1.25em } a.nextPa
>="rtl"] a.nextPage { background-position: left 40% !important; pa>ge:link, a.nextPage:visited { background-color: #069 } a.nextPage
>dding: .35em .75em .2em !important; position: left;} a.previousPa>:hover, a.nextPage:focus { background-color: #0099E6 } a.nextPage
>ge { display: block; margin: 0 1em 2em 0; font-size: 1.25em } a.p> { float:right } [dir="rtl"] a.nextPage { background-position: le
>reviousPage:link, a.previousPage:visited { background-color: #069>ft 40% !important; padding: .35em .75em .2em !important; position
> } a.previousPage:hover, a.previousPage:focus { background-color:>: left;} a.previousPage { display: block; margin: 0 1em 2em 0; fo
> #0099E6 } a.previousPage { float:left } [dir="rtl"] a.previousPa>nt-size: 1.25em } a.previousPage:link, a.previousPage:visited { b
>ge { background-position: left 40% !important; padding: .35em .75>ackground-color: #069 } a.previousPage:hover, a.previousPage:focu
>em .2em !important; position: right;} /* styles for liveSample li>s { background-color: #0099E6 } a.previousPage { float:left } [di
>nk : https://developer.mozilla.org/en-US/docs/Template:LiveSample>r="rtl"] a.previousPage { background-position: left 40% !importan
> */ a.liveSample { display: inline-block; margin: 0 3px 1em; font>t; padding: .35em .75em .2em !important; position: right;} /* sty
>-size: 1.25em } a.liveSample:link, a.liveSample:visited { backgro>les for liveSample link : https://developer.mozilla.org/en-US/doc
>und-color: #069 } a.liveSample:hover, a.liveSample:focus { backgr>s/Template:LiveSample */ a.liveSample { display: inline-block; ma
>ound-color: #0099E6 } [dir="rtl"] a.liveSample { background-posit>rgin: 0 3px 1em; font-size: 1.25em } a.liveSample:link, a.liveSam
>ion: left 40% !important; padding: .35em .75em .2em !important; }>ple:visited { background-color: #069 } a.liveSample:hover, a.live
> /* callout boxes etc */ .standardSidebar { border: 1px solid #77>Sample:focus { background-color: #0099E6 } [dir="rtl"] a.liveSamp
>7; margin: 0 0 15px 15px; padding: 0 15px 5px; float: right; back>le { background-position: left 40% !important; padding: .35em .75
>ground: #eee; font-size: .85em; position: relative; z-index: 2; }>em .2em !important; } /* callout boxes etc */ .standardSidebar { 
> [dir="rtl"] .standardSidebar { margin: 0 15px 15px 0; float: lef>border: 1px solid #777; margin: 0 0 15px 15px; padding: 0 15px 5p
>t } /* Colored text for INCORRECT/BAD and CORRECT/GOOD values (an>x; float: right; background: #eee; font-size: .85em; position: re
>d BEST)*/ .correct { color: green } .incorrect { color: red } .be>lative; z-index: 2; } [dir="rtl"] .standardSidebar { margin: 0 15
>st { color: #396 } /* Item in a list of item that has been done *>px 15px 0; float: left } /* Colored text for INCORRECT/BAD and CO
>/ .done { text-decoration: line-through } /* Specific items for t>RRECT/GOOD values (and BEST)*/ .correct { color: green } .incorre
>utorials */ .tuto_details, .tuto_example { border: 1px solid #36b>ct { color: red } .best { color: #396 } /* Item in a list of item
>; padding: .5em; margin-bottom: 1em } .tuto_details { background:> that has been done */ .done { text-decoration: line-through } /*
> #f4f4f4 } .tuto_example { background: #fffff4 } .tuto_type { fon> Specific items for tutorials */ .tuto_details, .tuto_example { b
>t-weight: 700; text-align: left } /* This is a specific item for >order: 1px solid #36b; padding: .5em; margin-bottom: 1em } .tuto_
>the CSS tutorial: https://developer.mozilla.org/en-US/docs/CSS/Ge>details { background: #f4f4f4 } .tuto_example { background: #ffff
>tting_Started/Selectors */ /* To be removed once we have Live Exa>f4 } .tuto_type { font-weight: 700; text-align: left } /* This is
>mples */ a.tutospecial:link, a.tutospecial:visited { padding: 1px> a specific item for the CSS tutorial: https://developer.mozilla.
> 10px; color: #fff; background: #555; border-radius: 3px; border:>org/en-US/docs/CSS/Getting_Started/Selectors */ /* To be removed 
> 1px outset #333 /* fallback for next line */ ; border: 1px outse>once we have Live Examples */ a.tutospecial:link, a.tutospecial:v
>t rgba(50,50,50,.5); font-family: georgia, serif; font-size: 14px>isited { padding: 1px 10px; color: #fff; background: #555; border
>; font-style: italic; text-decoration: none; } a.tutospecial:hove>-radius: 3px; border: 1px outset #333 /* fallback for next line *
>r, a.tutospecial:focus, a.tutospecial:active {background-color: #>/ ; border: 1px outset rgba(50,50,50,.5); font-family: georgia, s
>666;} #tutochallenge { display:none } #tutochallenge a.hideAnswer>erif; font-size: 14px; font-style: italic; text-decoration: none;
> { font-size: 12px; text-align:right ; display:block} #tutochalle> } a.tutospecial:hover, a.tutospecial:focus, a.tutospecial:active
>nge:target { display:block;} #tutochallenge + a { font-size: 12px> {background-color: #666;} #tutochallenge { display:none } #tutoc
>; text-align:right; display:block} #tutochallenge:target + a { di>hallenge a.hideAnswer { font-size: 12px; text-align:right ; displ
>splay:none; } /* Fix for mdn-min.css : https://developer.mozilla.>ay:block} #tutochallenge:target { display:block;} #tutochallenge 
>org/media/css/mdn-min.css */ [dir="rtl"] dd { margin: 0 22px .5em>+ a { font-size: 12px; text-align:right; display:block} #tutochal
> 0 } [dir="rtl"] th, [dir="rtl"] caption { text-align: right } [d>lenge:target + a { display:none; } /* Fix for mdn-min.css : https
>ir="rtl"] .title h1 { padding: 0 18px 0 0 !important } /* Fix for>://developer.mozilla.org/media/css/mdn-min.css */ [dir="rtl"] dd 
> wiki-min.css : https://developer.mozilla.org/media/css/wiki-min.>{ margin: 0 22px .5em 0 } [dir="rtl"] th, [dir="rtl"] caption { t
>css */ div.bug, div.warning { overflow: hidden } .page-content dd>ext-align: right } [dir="rtl"] .title h1 { padding: 0 18px 0 0 !i
> { margin: .5em } /* [dir="rtl"] .translate #page-buttons { } */ >mportant } /* Fix for wiki-min.css : https://developer.mozilla.or
>[dir="rtl"] .hasJS #nav-main #nav-sub-docs, [dir="rtl"] #nav-main>g/media/css/wiki-min.css */ div.bug, div.warning { overflow: hidd
> .menu:hover #nav-sub-docs { margin-left: -300px } [dir="rtl"] #n>en } .page-content dd { margin: .5em } /* [dir="rtl"] .translate 
>av-main #nav-sub-docs li { float: right } [dir="rtl"] #nav-main #>#page-buttons { } */ [dir="rtl"] .hasJS #nav-main #nav-sub-docs, 
>nav-sub-docs p { text-align: left } [dir="rtl"] .page-content ul >[dir="rtl"] #nav-main .menu:hover #nav-sub-docs { margin-left: -3
>{ padding-left: 0; padding-right: 22px } [dir="rtl"] .page-conten>00px } [dir="rtl"] #nav-main #nav-sub-docs li { float: right } [d
>t dd { padding-left: 0; padding-right: 15px } [dir="rtl"] .articl>ir="rtl"] #nav-main #nav-sub-docs p { text-align: left } [dir="rt
>e a.external, [dir="rtl"] .article a[rel~="external"], [dir="rtl">l"] .page-content ul { padding-left: 0; padding-right: 22px } [di
>] .article a[href^="news://"] { padding-right: 0; background-posi>r="rtl"] .page-content dd { padding-left: 0; padding-right: 15px 
>tion: 1% 40% } [dir="rtl"] .article a.external, [dir="rtl"] .arti>} [dir="rtl"] .article a.external, [dir="rtl"] .article a[rel~="e
>cle a[rel~="external"] { padding-left: 16px } [dir="rtl"] .articl>xternal"], [dir="rtl"] .article a[href^="news://"] { padding-righ
>e a[href^="news://"] { padding-left: 18px } /* for B2G docs, to a>t: 0; background-position: 1% 40% } [dir="rtl"] .article a.extern
>llow use of B2G lookalike UX elements */ /* For display of Firefo>al, [dir="rtl"] .article a[rel~="external"] { padding-left: 16px 
>x OS UX screenshots in a grid */ table.fxosScreenGrid, table.fxos>} [dir="rtl"] .article a[href^="news://"] { padding-left: 18px } 
>ScreenGrid tr { border: none; } table.fxosScreenGrid td, table.fx>/* for B2G docs, to allow use of B2G lookalike UX elements */ /* 
>osScreenGrid th { border: none; width: 340px; vertical-align: top>For display of Firefox OS UX screenshots in a grid */ table.fxosS
> } div.fxosLiveSampleWrapper { width: 328px; padding: 6px 4px; te>creenGrid, table.fxosScreenGrid tr { border: none; } table.fxosSc
>xt-align: center; border: 1px solid #B8B2A4; background-color: #F>reenGrid td, table.fxosScreenGrid th { border: none; width: 340px
>3ECDD; } .rightButtonBox { float: right; width: 250px; position: >; vertical-align: top } div.fxosLiveSampleWrapper { width: 328px;
>relative; z-index: 2; } [dir="rtl"] .rightButtonBox { margin: 0 1> padding: 6px 4px; text-align: center; border: 1px solid #B8B2A4;
>5px 15px 0; float: left } /* ---------------------------------- *> background-color: #F3ECDD; } .rightButtonBox { float: right; wid
> Buttons * ---------------------------------- */ .b2g-button::-mo>th: 250px; position: relative; z-index: 2; } [dir="rtl"] .rightBu
>z-focus-inner { border: none; outline: none; } .b2g-button { widt>ttonBox { margin: 0 15px 15px 0; float: left } /* ---------------
>h: 100%; height: 3.8rem; margin: 0 0 1rem; padding: 0 1.5rem; -mo>------------------- * Buttons * ---------------------------------
>z-box-sizing: border-box; display: inline-block; vertical-align: >- */ .b2g-button::-moz-focus-inner { border: none; outline: none;
>middle; text-overflow: ellipsis; white-space: nowrap; overflow: h> } .b2g-button { width: 100%; height: 3.8rem; margin: 0 0 1rem; p
>idden; background: #fafafa url(https://developer.mozilla.org/medi>adding: 0 1.5rem; -moz-box-sizing: border-box; display: inline-bl
>a/gaia/shared/style/buttons/images/ui/default.png) repeat-x left >ock; vertical-align: middle; text-overflow: ellipsis; white-space
>bottom; border: .1rem solid #a6a6a6; border-radius: .2rem; font: >: nowrap; overflow: hidden; background: #fafafa url(https://devel
>500 1.6rem/3.8rem 'MozTT', Sans-serif; color: #333; text-align: c>oper.mozilla.org/media/gaia/shared/style/buttons/images/ui/defaul
>enter; text-shadow: .1rem .1rem 0 rgba(255, 255, 255, .3); text-d>t.png) repeat-x left bottom; border: .1rem solid #a6a6a6; border-
>ecoration: none; outline: none; } /* Press (default & recomme>radius: .2rem; font: 500 1.6rem/3.8rem 'MozTT', Sans-serif; color
>nd) */ .b2g-button:active, .b2g-button.recommend:active, .b2g-but>: #333; text-align: center; text-shadow: .1rem .1rem 0 rgba(255, 
>ton:hover, .b2g-button.recommend:hover { border-color: #008aaa; b>255, 255, .3); text-decoration: none; outline: none; } /* Press (
>ackground: #008aaa; text-decoration: none; color: #333; } /* For >default & recommend) */ .b2g-button:active, .b2g-button.recom
>styling bug links */ .bug-resolved { text-decoration: line-throug>mend:active, .b2g-button:hover, .b2g-button.recommend:hover { bor
>h; } /* Bages for the Spec2 template */ .spec-ED:before, .spec-WD>der-color: #008aaa; background: #008aaa; text-decoration: none; c
>:before, .spec-CR:before, .spec-PR:before, .spec-REC:before, .spe>olor: #333; } /* For styling bug links */ .bug-resolved { text-de
>c-RFC:before, .spec-Living:before, .spec-Standard:before, .spec-D>coration: line-through; } /* Bages for the Spec2 template */ .spe
>raft:before { display: inline-block; font: .6em Helvetica,Arial,s>c-ED:before, .spec-WD:before, .spec-CR:before, .spec-PR:before, .
>ans-serif; margin: 0 .6em 0 0; padding: .55em .45em .45em; vertic>spec-REC:before, .spec-RFC:before, .spec-Living:before, .spec-Sta
>al-align: top; } .redesign .spec-ED:before, .redesign .spec-WD:be>ndard:before, .spec-Draft:before { display: inline-block; font: .
>fore, .redesign .spec-CR:before, .redesign .spec-PR:before, .rede>6em Helvetica,Arial,sans-serif; margin: 0 .6em 0 0; padding: .55e
>sign .spec-REC:before, .redesign .spec-RFC:before, .redesign .spe>m .45em .45em; vertical-align: top; } .redesign .spec-ED:before, 
>c-Living:before, .redesign .spec-Standard:before, .redesign .spec>.redesign .spec-WD:before, .redesign .spec-CR:before, .redesign .
>-Draft:before { font:.7em Helvetica,Arial,sans-serif; font-weight>spec-PR:before, .redesign .spec-REC:before, .redesign .spec-RFC:b
>:700; min-width:20px; border-radius:2px; letter-spacing:1px; marg>efore, .redesign .spec-Living:before, .redesign .spec-Standard:be
>in:.2em .6em 0 0; padding:.45em .35em .35em; color: inherit; } .s>fore, .redesign .spec-Draft:before { font:.7em Helvetica,Arial,sa
>pec-ED:before, .spec-WD:before, .spec-CR:before, .spec-PR:before,>ns-serif; font-weight:700; min-width:20px; border-radius:2px; let
> .spec-REC:before, .spec-RFC:before, .spec-Living:before, .spec-S>ter-spacing:1px; margin:.2em .6em 0 0; padding:.45em .35em .35em;
>tandard:before, .spec-Draft:before { color: white; } .spec-ED:bef> color: inherit; } .spec-ED:before, .spec-WD:before, .spec-CR:bef
>ore { content: 'ED'; background-color: #e61919 } .redesign .spec->ore, .spec-PR:before, .spec-REC:before, .spec-RFC:before, .spec-L
>ED:before { background-color:rgba(230,25,25,0.25); border-left:4p>iving:before, .spec-Standard:before, .spec-Draft:before { color: 
>x solid rgba(230,25,25,1); color:rgba(230,25,25,1); } .spec-WD:be>white; } .spec-ED:before { content: 'ED'; background-color: #e619
>fore { content: 'WD'; background-color: #E66E33 } .redesign .spec>19 } .redesign .spec-ED:before { background-color:rgba(230,25,25,
>-WD:before { background-color:rgba(230,110,51,0.25); border-left:>0.25); border-left:4px solid rgba(230,25,25,1); color:rgba(230,25
>4px solid rgba(230,110,51,1); color:rgba(230,110,51,1); } .spec-C>,25,1); } .spec-WD:before { content: 'WD'; background-color: #E66
>R:before { content: 'CR'; background-color: #CFD510 } .redesign .>E33 } .redesign .spec-WD:before { background-color:rgba(230,110,5
>spec-CR:before { background-color:rgba(0,151,142,0.25); border-le>1,0.25); border-left:4px solid rgba(230,110,51,1); color:rgba(230
>ft:4px solid rgba(0,151,142,1); color:rgba(0,151,142,1); } .spec->,110,51,1); } .spec-CR:before { content: 'CR'; background-color: 
>PR:before { content: 'PR'; background-color: #72AC35 } .redesign >#CFD510 } .redesign .spec-CR:before { background-color:rgba(0,151
>.spec-PR:before { background-color:rgba(114,172,53,0.25); border->,142,0.25); border-left:4px solid rgba(0,151,142,1); color:rgba(0
>left:4px solid rgba(114,172,53,1); color:rgba(114,172,53,1); } .s>,151,142,1); } .spec-PR:before { content: 'PR'; background-color:
>pec-REC:before { content: 'REC'; background-color: #309C40 } .red> #72AC35 } .redesign .spec-PR:before { background-color:rgba(114,
>esign .spec-REC:before { background-color:rgba(48,156,64,0.25); b>172,53,0.25); border-left:4px solid rgba(114,172,53,1); color:rgb
>order-left:4px solid rgba(48,156,64,1); color:rgba(48,156,64,1); >a(114,172,53,1); } .spec-REC:before { content: 'REC'; background-
>} .spec-Living:before { content: 'LS'; background-color: #000 } .>color: #309C40 } .redesign .spec-REC:before { background-color:rg
>redesign .spec-Living:before { background-color:rgba(0,83,159,0.2>ba(48,156,64,0.25); border-left:4px solid rgba(48,156,64,1); colo
>5); border-left:4px solid rgba(0,83,159,1); color:rgba(0,83,159,1>r:rgba(48,156,64,1); } .spec-Living:before { content: 'LS'; backg
>); } .spec-RFC:before { content: 'RFC'; background-color: #000 } >round-color: #000 } .redesign .spec-Living:before { background-co
>.redesign .spec-RFC:before { background-color:rgba(0,83,159,0.25)>lor:rgba(0,83,159,0.25); border-left:4px solid rgba(0,83,159,1); 
>; border-left:4px solid rgba(0,83,159,1); color:rgba(0,83,159,1);>color:rgba(0,83,159,1); } .spec-RFC:before { content: 'RFC'; back
> } .spec-Standard:before { content: 'ST'; background-color: #000 >ground-color: #000 } .redesign .spec-RFC:before { background-colo
>} .redesign .spec-Standard:before { background-color:rgba(0,83,15>r:rgba(0,83,159,0.25); border-left:4px solid rgba(0,83,159,1); co
>9,0.25); border-left:4px solid rgba(0,83,159,1); color:rgba(0,83,>lor:rgba(0,83,159,1); } .spec-Standard:before { content: 'ST'; ba
>159,1); } .spec-Draft:before { content: 'D'; background-color: #E>ckground-color: #000 } .redesign .spec-Standard:before { backgrou
>66E33 } .redesign .spec-Draft:before { background-color:rgba(230,>nd-color:rgba(0,83,159,0.25); border-left:4px solid rgba(0,83,159
>110,51,0.25); border-left:4px solid rgba(230,110,51,1); color:rgb>,1); color:rgba(0,83,159,1); } .spec-Draft:before { content: 'D';
>a(230,110,51,1); } .redesign .spec-ED { color:rgba(230,25,25,1); > background-color: #E66E33 } .redesign .spec-Draft:before { backg
>} .redesign .spec-WD { color:rgba(230,110,51,1); } .redesign .spe>round-color:rgba(230,110,51,0.25); border-left:4px solid rgba(230
>c-CR { color:rgba(0,151,142,1); } .redesign .spec-PR { color:rgba>,110,51,1); color:rgba(230,110,51,1); } .redesign .spec-ED { colo
>(114,172,53,1); } .redesign .spec-REC { color:rgba(48,156,64,1); >r:rgba(230,25,25,1); } .redesign .spec-WD { color:rgba(230,110,51
>} .redesign .spec-RFC { color:rgba(48,156,64,1); } .redesign .spe>,1); } .redesign .spec-CR { color:rgba(0,151,142,1); } .redesign 
>c-Living { color:rgba(0,83,159,1); } .redesign .spec-Standard { c>.spec-PR { color:rgba(114,172,53,1); } .redesign .spec-REC { colo
>olor:rgba(0,83,159,1); } .redesign .spec-Draft { color:rgba(230,1>r:rgba(48,156,64,1); } .redesign .spec-RFC { color:rgba(48,156,64
>10,51,1); } /* Template link style */ .templateLink { border: 1px>,1); } .redesign .spec-Living { color:rgba(0,83,159,1); } .redesi
> solid #ccc; padding: 1px; } /* * Colorized icons */ #wikiArticle>gn .spec-Standard { color:rgba(0,83,159,1); } .redesign .spec-Dra
> i.icon-beaker, #wikiArticle i.icon-warning-sign, #wikiArticle i.>ft { color:rgba(230,110,51,1); } /* Template link style */ .templ
>icon-thumbs-down-alt, #wikiArticle i.icon-stethoscope, #wikiArtic>ateLink { border: 1px solid #ccc; padding: 1px; } /* * Colorized 
>le i.icon-trash { cursor: default } #wikiArticle i.icon-beaker { >icons */ #wikiArticle i.icon-beaker, #wikiArticle i.icon-warning-
>color: #09d } /* experimental */ #wikiArticle i.icon-warning-sign>sign, #wikiArticle i.icon-thumbs-down-alt, #wikiArticle i.icon-st
> { color: #db0 } /* non-standard */ #wikiArticle i.icon-thumbs-do>ethoscope, #wikiArticle i.icon-trash { cursor: default } #wikiArt
>wn-alt { color: #000 } /* deprecated */ #wikiArticle i.icon-trash>icle i.icon-beaker { color: #09d } /* experimental */ #wikiArticl
> { color: #d00 } /* obsolete */ #wikiArticle i.icon-stethoscope {>e i.icon-warning-sign { color: #db0 } /* non-standard */ #wikiArt
> color: darkslateblue } /* unimplemented */ /* * Landing page lis>icle i.icon-thumbs-down-alt { color: #000 } /* deprecated */ #wik
>ts */ dt.landingPageList, dd.landingPageList { page-break-after: >iArticle i.icon-trash { color: #d00 } /* obsolete */ #wikiArticle
>avoid } /* * "Mozilla only" banners */ .bannerWrapper { overflow:> i.icon-stethoscope { color: darkslateblue } /* unimplemented */ 
> hidden; padding-right: 2px; } .mozOnlyBanner { background-color:>/* * Landing page lists */ dt.landingPageList, dd.landingPageList
> #C33B1D; background-image: url("https://developer.mozilla.org/fi> { page-break-after: avoid } /* * "Mozilla only" banners */ .bann
>les/5429/firefox.png"), radial-gradient(circle 16px at 18px 18px,>erWrapper { overflow: hidden; padding-right: 2px; } .mozOnlyBanne
> rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.5) 11px, rgba(0,0,0,0) 18px), l>r { background-color: #C33B1D; background-image: url("https://dev
>inear-gradient(to right, #C33B1D 40%, #DDA820); background-repeat>eloper.mozilla.org/files/5429/firefox.png"), radial-gradient(circ
>: no-repeat; background-size: contain; border-top-left-radius: 18>le 16px at 18px 18px, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.5) 11px, r
>px; border-bottom-left-radius: 18px; border-top-right-radius: 6px>gba(0,0,0,0) 18px), linear-gradient(to right, #C33B1D 40%, #DDA82
>; border-bottom-right-radius: 6px; height: 36px; overflow: hidden>0); background-repeat: no-repeat; background-size: contain; borde
>; color: white; box-shadow: 0 0 3px #111; font-family: "Lucida Gr>r-top-left-radius: 18px; border-bottom-left-radius: 18px; border-
>ande","Lucida Sans Unicode","DejaVu Sans",Lucida,Arial,Helvetica,>top-right-radius: 6px; border-bottom-right-radius: 6px; height: 3
>sans-serif; } .mozOnlyBanner dt { font-weight: bold; font-size: 1>6px; overflow: hidden; color: white; box-shadow: 0 0 3px #111; fo
>6px; text-shadow: 1px 1px 0 #222; padding-left: 42px; margin-left>nt-family: "Lucida Grande","Lucida Sans Unicode","DejaVu Sans",Lu
>: 0px; margin-bottom: 0px; padding-bottom: 0px; } .mozOnlyBanner >cida,Arial,Helvetica,sans-serif; } .mozOnlyBanner dt { font-weigh
>dd { font-size: 11px; text-shadow: 1px 1px 0 #222; padding-left: >t: bold; font-size: 16px; text-shadow: 1px 1px 0 #222; padding-le
>42px; margin-left: 0px; margin-top: 0px; padding-top: 0px; } /* 一>ft: 42px; margin-left: 0px; margin-bottom: 0px; padding-bottom: 0
>時的なスタイル */ [lang="ja"] #doc-contributors time[datetime*="200"]::a>px; } .mozOnlyBanner dd { font-size: 11px; text-shadow: 1px 1px 0
>fter { content: " (※最終更新日から 2 年以上経過しています)"; color: red } /* redes> #222; padding-left: 42px; margin-left: 0px; margin-top: 0px; pad
>ign htabs */ .redesign .htab>ul>li { height: 32px; border:1>ding-top: 0px; } /* 一時的なスタイル */ [lang="ja"] #doc-contributors tim
>px solid rgba(212,221,228,0); border-radius: 0; font-size:14px; f>e[datetime*="200"]::after { content: " (※最終更新日から 2 年以上経過しています)"; 
>ont-weight:200; font-family:'Open Sans Light',sans-serif; backgro>color: red } /* redesign htabs */ .redesign .htab>ul>li { h
>und-color:#f1f6f8!important; color:rgba(77,78,83,1); opacity:.75;>eight: 32px; border:1px solid rgba(212,221,228,0); border-radius:
> -ms-filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=75); > 0; font-size:14px; font-weight:200; font-family:'Open Sans Light
>filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=75); } .re>',sans-serif; background-color:#f1f6f8!important; color:rgba(77,7
>design .htab>ul>li.selected { border:0 solid rgba(212,221,2>8,83,1); opacity:.75; -ms-filter:progid:DXImageTransform.Microsof
>28,0.25); border-top:2px solid rgba(212,221,228,1); padding-top: >t.Alpha(Opacity=75); filter:progid:DXImageTransform.Microsoft.Alp
>4px; background-color:rgba(234,239,242,1)!important; } .redesign >ha(Opacity=75); } .redesign .htab>ul>li.selected { border:0
>.htab>div { background-color:rgba(234,239,242,1); border:0 sol> solid rgba(212,221,228,0.25); border-top:2px solid rgba(212,221,
>id rgba(212,221,228,0.25); } .redesign .htab > ul > li >>228,1); padding-top: 4px; background-color:rgba(234,239,242,1)!im
> a { text-decoration: none; padding:2px 18px 4px; } .redesign .ht>portant; } .redesign .htab>div { background-color:rgba(234,239
>ab > ul > li > a:hover, .redesign .htab > ul > li >,242,1); border:0 solid rgba(212,221,228,0.25); } .redesign .htab
>> a:focus { text-decoration: underline; } /* new modules */ .s> > ul > li > a { text-decoration: none; padding:2px 18px
>ummary-box-events { display:table; background-color:rgba(0,150,22> 4px; } .redesign .htab > ul > li > a:hover, .redesign .
>1,0.1); padding:11px 22px; } .redesign[dir="ltr"] .summary-box-ev>htab > ul > li > a:focus { text-decoration: underline; }
>ents { clear:left; border-left:6px solid rgba(0,150,221,0.5); } .> /* new modules */ .summary-box-events { display:table; backgroun
>redesign[dir="rtl"] .summary-box-events { clear:right; border-rig>d-color:rgba(0,150,221,0.1); padding:11px 22px; } .redesign[dir="
>ht:6px solid rgba(0,150,221,0.5); } .summary-box-js { display:tab>ltr"] .summary-box-events { clear:left; border-left:6px solid rgb
>le; background-color:rgba(230,96,0,0.1); padding: 11px 22px; } .r>a(0,150,221,0.5); } .redesign[dir="rtl"] .summary-box-events { cl
>edesign[dir="ltr"] .summary-box-js { clear:left; border-left:6px >ear:right; border-right:6px solid rgba(0,150,221,0.5); } .summary
>solid rgba(230,96,0,0.5); } .redesign[dir="rtl"] .summary-box-js >-box-js { display:table; background-color:rgba(230,96,0,0.1); pad
>{ clear:right; border-right:6px solid rgba(230,96,0,0.5); } .rede>ding: 11px 22px; } .redesign[dir="ltr"] .summary-box-js { clear:l
>sign .standardNote, .redesign .optional,.renamed { background:rgb>eft; border-left:6px solid rgba(230,96,0,0.5); } .redesign[dir="r
>a(0,83,159,0.2); border-color:rgba(0,0,0,0.05); } .redesign .obso>tl"] .summary-box-js { clear:right; border-right:6px solid rgba(2
>lete, .redesign .notXPCOM { background:rgba(230,96,0,0.45); borde>30,96,0,0.5); } .redesign .standardNote, .redesign .optional,.ren
>r-color:rgba(0,0,0,0.05); } /* sidebar quick links stuff */ .quic>amed { background:rgba(0,83,159,0.2); border-color:rgba(0,0,0,0.0
>k-links .sidebar-icon i[class^="icon-"] { top: 10px; position: ab>5); } .redesign .obsolete, .redesign .notXPCOM { background:rgba(
>solute; left: 12px; display: block; opacity: 0.3; } /* new commun>230,96,0,0.45); border-color:rgba(0,0,0,0.05); } /* sidebar quick
>ity box */ .communitybox { background-color: rgba(0,83,159,1); ba> links stuff */ .quick-links .sidebar-icon i[class^="icon-"] { to
>ckground-image: url("/media/redesign/img/blueprint.png"); } .comm>p: 10px; position: absolute; left: 12px; display: block; opacity:
>unitybox, .communitybox a, .communitybox a:hover, .communitybox a> 0.3; } /* new community box */ .communitybox { background-color:
>:focus, .communitybox a:visited { color: #fff; } .communitybox .c> rgba(0,83,159,1); background-image: url("/media/redesign/img/blu
>ommunitysubhead { font-size: 16px; font-weight: bold; margin-top:>eprint.png"); } .communitybox, .communitybox a, .communitybox a:h
> 13px; padding-bottom: 6px; } .communitybox ul { padding-left: 0;>over, .communitybox a:focus, .communitybox a:visited { color: #ff
> margin-bottom:0; list-style-type: none; } .communitybox ul.commu>f; } .communitybox .communitysubhead { font-size: 16px; font-weig
>nitymailinglist li { display: inline-block; margin-right: 4px; ma>ht: bold; margin-top: 13px; padding-bottom: 6px; } .communitybox 
>rgin-top: 6px} .communitybox ul.communitymailinglist a { backgrou>ul { padding-left: 0; margin-bottom:0; list-style-type: none; } .
>nd: rgba(255, 255, 255, 0.3); display: inline-block; color: #fff;>communitybox ul.communitymailinglist li { display: inline-block; 
> padding: 3px 6px; border-radius: 3px; } .communitybox .community>margin-right: 4px; margin-top: 6px} .communitybox ul.communitymai
>contact { font-size: 14px; margin-top: 13px;} .communitybox .comm>linglist a { background: rgba(255, 255, 255, 0.3); display: inlin
>unitycontact a { border-bottom: 1px solid rgba(255, 255, 255, 0.6>e-block; color: #fff; padding: 3px 6px; border-radius: 3px; } .co
>); } .communitybox .communitycontact a:hover, .communitybox .comm>mmunitybox .communitycontact { font-size: 14px; margin-top: 13px;
>unitycontact a:focus { text-decoration:none; border-bottom: 1px s>} .communitybox .communitycontact a { border-bottom: 1px solid rg
>olid rgba(255, 255, 255, 0.9); } .communitybox strong { font-size>ba(255, 255, 255, 0.6); } .communitybox .communitycontact a:hover
>: 15px; font-weight: bold; } /* Default glossary links style to e>, .communitybox .communitycontact a:focus { text-decoration:none;
>ase readability */ a.glossaryLink:link, a.glossaryLink:hover, a.g> border-bottom: 1px solid rgba(255, 255, 255, 0.9); } .communityb
>lossaryLink:visited, a.glossaryLink:focus, a.glossaryLink:active{>ox strong { font-size: 15px; font-weight: bold; } /* Default glos
> color:inherit; text-decoration: none; border-bottom: 1px dashed >sary links style to ease readability */ a.glossaryLink:link, a.gl
>#CCC; } a.new.glossaryLink:link, a.new.glossaryLink:hover, a.new.>ossaryLink:hover, a.glossaryLink:visited, a.glossaryLink:focus, a
>glossaryLink:visited, a.new.glossaryLink:focus, a.new.glossaryLin>.glossaryLink:active{ color:inherit; text-decoration: none; borde
>k:active{ color:#900; border-bottom: none; } a.new.glossaryLink:h>r-bottom: 1px dashed #CCC; } a.new.glossaryLink:link, a.new.gloss
>over { text-decoration: underline; }>aryLink:hover, a.new.glossaryLink:visited, a.new.glossaryLink:foc
 >us, a.new.glossaryLink:active{ color:#900; border-bottom: none; }
 > a.new.glossaryLink:hover { text-decoration: underline; }

Back to History