mozilla

Compare Revisions

Template:CustomCSS

Change Revisions

Revision 588649:

Revision 588649 by DavidWalsh on

Revision 594595:

Revision 594595 by DavidWalsh on

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

Revision 588649
Revision 594595
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 -- */
> /* bug 991732: Quick hack to hide the "external link" indicator > /* bug 991732: Quick hack to hide the "external link" indicator 
>where class="ignore-external" */ body article .ignore-external:be>where class="ignore-external" */ body article .ignore-external:be
>fore { content: ""; } /* Used for footnotes in {{PricePointTable}>fore { content: ""; } /* Used for footnotes in {{PricePointTable}
>} (footnotes styles should be unified) */ .footnote { vertical-al>} (footnotes styles should be unified) */ .footnote { vertical-al
>ign: super; font-size:60%;} /* Make the 2nd breadcrumbs disappear>ign: super; font-size:60%;} /* Make the 2nd breadcrumbs disappear
>, only if the page has been regenerated with a modern template */>, only if the page has been regenerated with a modern template */
> .column-container #wikiArticle .themeUpdated { display:none } /*> .column-container #wikiArticle .themeUpdated { display:none } /*
> Used to wrap columns that should all be the same height */ .equa> Used to wrap columns that should all be the same height */ .equa
>lColumnHeights { display: table; border-collapse: separate; borde>lColumnHeights { display: table; border-collapse: separate; borde
>r-spacing: 20px; } .equalColumnHeights div { display: table-cell;>r-spacing: 20px; } .equalColumnHeights div { display: table-cell;
> width: 50%; height:100%; } // Use for large table (.thirdColumn > width: 50%; height:100%; } // Use for large table (.thirdColumn 
>+ .***Bg) table#fullwidth-table td.thirdColumn { width: 30%; } .g>+ .***Bg) table#fullwidth-table td.thirdColumn { width: 30%; } .g
>reenBg { width: 30%; background-color: rgb(128,255,128); } .light>reenBg { width: 30%; background-color: rgb(128,255,128); } .light
>GreenBg { background-color: rgb(220,255,220); } .yellowBg { backg>GreenBg { background-color: rgb(220,255,220); } .yellowBg { backg
>round-color: rgb(255,255,220); } .orangeBg { background-color: rg>round-color: rgb(255,255,220); } .orangeBg { background-color: rg
>b(255,160,100); } .redBg { background-color: #F66; } /* highlight>b(255,160,100); } .redBg { background-color: #F66; } /* highlight
>ed (bottom) link in call-out boxes */ .callout-link-container { p>ed (bottom) link in call-out boxes */ .callout-link-container { p
>osition:relative; height:100%; } .callout-link-wrapper { padding->osition:relative; height:100%; } .callout-link-wrapper { padding-
>top:32px; } .callout-link { font-style: italic; font-size: 14px; >top:32px; } .callout-link { font-style: italic; font-size: 14px; 
>font-weight: normal; display:block; position:absolute; bottom:0; >font-weight: normal; display:block; position:absolute; bottom:0; 
>right:0; } /* remove left margin from Font Awesome icons inside w>right:0; } /* remove left margin from Font Awesome icons inside w
>iki content; this is messing up document content */ #wikiArticle >iki content; this is messing up document content */ #wikiArticle 
>i[class^="icon-"] { margin-left: 0px; } /* Iframe for live sample>i[class^="icon-"] { margin-left: 0px; } /* Iframe for live sample
> centered (Test) */ .centered iframe { display: block; margin: 0 > centered (Test) */ .centered iframe { display: block; margin: 0 
>auto;border:none } /* Simulate two columns for landing page, if e>auto;border:none } /* Simulate two columns for landing page, if e
>nough space is available */ @media (min-width:1050px) { .topicpag>nough space is available */ @media (min-width:1050px) { .topicpag
>e-table {display: table; border-collapse: separate; border-spacin>e-table {display: table; border-collapse: separate; border-spacin
>g: 20px 0 } /* Next line to remove once the redesign is live: */ >g: 20px 0 } /* Next line to remove once the redesign is live: */ 
>.topicpage-table .section:first-of-type { margin-right: 20px; bor>.topicpage-table .section:first-of-type { margin-right: 20px; bor
>der-right: solid 6px rgba(212,221,228,0.5); } html[dir="rtl"] .to>der-right: solid 6px rgba(212,221,228,0.5); } html[dir="rtl"] .to
>picpage-table .section:first-of-type { border-left:solid 6px rgba>picpage-table .section:first-of-type { border-left:solid 6px rgba
>(212,221,228,0.5); border-right: none; } .landing { display: tabl>(212,221,228,0.5); border-right: none; } .landing { display: tabl
>e-row;} .section { display: table-cell; width:50%;} } /* For Land>e-row;} .section { display: table-cell; width:50%;} } /* For Land
>ing page boxes; these are boxes displayed within columns on landi>ing page boxes; these are boxes displayed within columns on landi
>ng pages, such as the Community and Related boxes. */ .landingPag>ng pages, such as the Community and Related boxes. */ .landingPag
>eBox { width: 100%; padding: 0px; border-bottom: 1px solid #bbb; >eBox { width: 100%; padding: 0px; border-bottom: 1px solid #bbb; 
>margin-bottom: 3px; } .landingPageBox ul { padding-left: 44px; } >margin-bottom: 3px; } .landingPageBox ul { padding-left: 44px; } 
>/* Wide column box */ .wideColumnBox { column-width:375px; -moz-c>/* Wide column box */ .wideColumnBox { column-width:375px; -moz-c
>olumn-width:375px; -webkit-column-width:375px; -o-column-width:37>olumn-width:375px; -webkit-column-width:375px; -o-column-width:37
>5px; -ms-column-width:375px;} .wideColumnBoxList li { line-height>5px; -ms-column-width:375px;} .wideColumnBoxList li { line-height
>: 1.5; list-style-type: none; padding-left: 0; page-break-inside:>: 1.5; list-style-type: none; padding-left: 0; page-break-inside:
> avoid; } /* Multi-column boxes for lists of longer links; this w> avoid; } /* Multi-column boxes for lists of longer links; this w
>ill adapt based on screen width */ .multiColumnList { column-widt>ill adapt based on screen width */ .multiColumnList { column-widt
>h:250px; -moz-column-width:250px; -webkit-column-width:250px; -o->h:250px; -moz-column-width:250px; -webkit-column-width:250px; -o-
>column-width:250px; -ms-column-width:250px;} .multiColumnList li >column-width:250px; -ms-column-width:250px;} .multiColumnList li 
>{ line-height: 1.5; list-style-type: none; padding-left: 0; page->{ line-height: 1.5; list-style-type: none; padding-left: 0; page-
>break-inside: avoid; } /* Multi-column boxes for smaller links, s>break-inside: avoid; } /* Multi-column boxes for smaller links, s
>uch as API terms */ .smallMultiColumnList { column-width: 120px; >uch as API terms */ .smallMultiColumnList { column-width: 120px; 
>-moz-column-width:120px; -webkit-column-width:120px; -o-column-wi>-moz-column-width:120px; -webkit-column-width:120px; -o-column-wi
>dth:120px; -ms-column-width:120px} .smallMultiColumnList li { lis>dth:120px; -ms-column-width:120px} .smallMultiColumnList li { lis
>t-style-type: none; padding-left: 0; page-break-inside: avoid; } >t-style-type: none; padding-left: 0; page-break-inside: avoid; } 
>/* Multi-column box for smaller text */ .horizFlexboxContainer { >/* Multi-column box for smaller text */ .horizFlexboxContainer { 
>display: flex; display: -webkit-flex; flex-flow: column nowrap; ->display: flex; display: -webkit-flex; flex-flow: column nowrap; -
>webkit-flex-flow: column nowrap; justify-content: center; -webkit>webkit-flex-flow: column nowrap; justify-content: center; -webkit
>-justify-content: center; align-content: center; -webkit-align-co>-justify-content: center; align-content: center; -webkit-align-co
>ntent: center; align-items: center; -webkit-align-items: center; >ntent: center; align-items: center; -webkit-align-items: center; 
>flex-direction: column; -webkit-flex-direction: column; } div.sma>flex-direction: column; -webkit-flex-direction: column; } div.sma
>llTextMultiColumnBoxHeading { background-color: #aac; border-radi>llTextMultiColumnBoxHeading { background-color: #aac; border-radi
>us: 10px 10px 0 0; border: 2px solid #ccc; order: 1; -webkit-orde>us: 10px 10px 0 0; border: 2px solid #ccc; order: 1; -webkit-orde
>r: 1; width: 75%; padding: 10px; flex: 0 1 auto; -webkit-flex: 0 >r: 1; width: 75%; padding: 10px; flex: 0 1 auto; -webkit-flex: 0 
>1 auto; font-weight: bold; } div.smallTextMultiColumnBoxList { bo>1 auto; font-weight: bold; } div.smallTextMultiColumnBoxList { bo
>rder: 2px solid #ccc; background-color: #ddf; border-top: 0; bord>rder: 2px solid #ccc; background-color: #ddf; border-top: 0; bord
>er-radius: 0 0 10px 10px; width: 75%; padding: 10px; order: 2; -w>er-radius: 0 0 10px 10px; width: 75%; padding: 10px; order: 2; -w
>ebkit-order: 2; flex: 0 1 auto; -webkit-flex: 0 1 auto; } div.sma>ebkit-order: 2; flex: 0 1 auto; -webkit-flex: 0 1 auto; } div.sma
>llTextMultiColumnBoxList ul { column-width:100px; -moz-column-wid>llTextMultiColumnBoxList ul { column-width:100px; -moz-column-wid
>th:100px; -webkit-column-width:100px; -o-column-width:100px; -ms->th:100px; -webkit-column-width:100px; -o-column-width:100px; -ms-
>column-width:100px; } div.smallTextMultiColumnBoxList li { list-s>column-width:100px; } div.smallTextMultiColumnBoxList li { list-s
>tyle-type: none; padding-left: 0; font-size: 80%; } /* For ending>tyle-type: none; padding-left: 0; font-size: 80%; } /* For ending
> "text alongside images" blocks; add this class to the first bloc> "text alongside images" blocks; add this class to the first bloc
>k that shouldn't be next to the image */ .endImageWrapping { clea>k that shouldn't be next to the image */ .endImageWrapping { clea
>r: both; } /* Fancy Table of content for main pages of tutorial*/>r: both; } /* Fancy Table of content for main pages of tutorial*/
> .fancyTOC { counter-reset: fancyTOC; -moz-columns: 18em; columns> .fancyTOC { counter-reset: fancyTOC; -moz-columns: 18em; columns
>: 18em; margin-bottom: 1em } .fancyTOC .button { display: block; >: 18em; margin-bottom: 1em } .fancyTOC .button { display: block; 
>margin-right: 0; margin-bottom: .25em; background-color: #A24C4C;>margin-right: 0; margin-bottom: .25em; background-color: #A24C4C;
> color: #fff; font-size: 1.5em; line-height: 1.5 } .fancyTOC a::b> color: #fff; font-size: 1.5em; line-height: 1.5 } .fancyTOC a::b
>efore { counter-increment: fancyTOC; content: counter(fancyTOC) ">efore { counter-increment: fancyTOC; content: counter(fancyTOC) "
>. " } .fancyTOC a::after { content: ' »' } .fancyTOC .button:hove>. " } .fancyTOC a::after { content: ' »' } .fancyTOC .button:hove
>r, .fancyTOC .button:focus, .fancyTOC .button:active { background>r, .fancyTOC .button:focus, .fancyTOC .button:active { background
>-color: #C26C6C } /* In index, dim obsolete, deprecated or non-st>-color: #C26C6C } /* In index, dim obsolete, deprecated or non-st
>andard element instead of striking through them */ s.deprecatedEl>andard element instead of striking through them */ s.deprecatedEl
>ement, s.obsoleteElement, s.nonStdElement { text-decoration: none>ement, s.obsoleteElement, s.nonStdElement { text-decoration: none
>; opacity: .3 } /* Add widgeted index, here adding an HTML5 badge>; opacity: .3 } /* Add widgeted index, here adding an HTML5 badge
> as the bullet of the li element if class="html5" */ div.index.wi> as the bullet of the li element if class="html5" */ div.index.wi
>dgeted { -webkit-column-width: 10em; -moz-column-width: 10em; col>dgeted { -webkit-column-width: 10em; -moz-column-width: 10em; col
>umns: 10em } div.index.widgeted li { padding-left: 18px } div.ind>umns: 10em } div.index.widgeted li { padding-left: 18px } div.ind
>ex.widgeted li.html5 { background-image: url("/files/3855/HTML5_B>ex.widgeted li.html5 { background-image: url("/files/3855/HTML5_B
>adge_16.png"); background-repeat: no-repeat; background-position:>adge_16.png"); background-repeat: no-repeat; background-position:
> left 4px } [dir="rtl"] div.index.widgeted li { padding-right: 18> left 4px } [dir="rtl"] div.index.widgeted li { padding-right: 18
>px } [dir="rtl"] div.index.widgeted li.html5 { background-image: >px } [dir="rtl"] div.index.widgeted li.html5 { background-image: 
>url("/files/3855/HTML5_Badge_16.png"); background-repeat: no-repe>url("/files/3855/HTML5_Badge_16.png"); background-repeat: no-repe
>at; background-position: right 4px } [dir="rtl"] div.index.widget>at; background-position: right 4px } [dir="rtl"] div.index.widget
>ed span { padding-right:24px } /* Add widgeted index, adding a We>ed span { padding-right:24px } /* Add widgeted index, adding a We
>bcomponent badge of the li element if class="webcomp" */ div.inde>bcomponent badge of the li element if class="webcomp" */ div.inde
>x.widgeted li.webcomp::after { font-family: FontAwesome; content:>x.widgeted li.webcomp::after { font-family: FontAwesome; content:
>" \f085";} /* Quicknav template styles : https://developer.mozill>" \f085";} /* Quicknav template styles : https://developer.mozill
>a.org/en-US/docs/Template:quicknav -------- */ #wikiArticle { pos>a.org/en-US/docs/Template:quicknav -------- */ #wikiArticle { pos
>ition: relative; } .quicknav { position: fixed; top: 237px; left:>ition: relative; } .quicknav { position: fixed; top: 237px; left:
> 33px; background: #FFF; z-index: 1 } .quicknav dl { max-width: 0> 33px; background: #FFF; z-index: 1 } .quicknav dl { max-width: 0
>; max-height: 300px; overflow: auto; margin: 0; padding: 10px 0; >; max-height: 300px; overflow: auto; margin: 0; padding: 10px 0; 
>border: 1px solid transparent; border-left: none -webkit-transiti>border: 1px solid transparent; border-left: none -webkit-transiti
>on: border .5s ease .1s, max-width .5s ease .1s, padding .5s line>on: border .5s ease .1s, max-width .5s ease .1s, padding .5s line
>ar .1s; -moz-transition: border .5s ease .1s, max-width .5s ease >ar .1s; -moz-transition: border .5s ease .1s, max-width .5s ease 
>.1s, padding .5s linear .1s; -ms-transition: border .5s ease .1s,>.1s, padding .5s linear .1s; -ms-transition: border .5s ease .1s,
> max-width .5s ease .1s, padding .5s linear .1s; -o-transition: b> max-width .5s ease .1s, padding .5s linear .1s; -o-transition: b
>order .5s ease .1s, max-width .5s ease .1s, padding .5s linear .1>order .5s ease .1s, max-width .5s ease .1s, padding .5s linear .1
>s; transition: border .5s ease .1s, max-width .5s ease .1s, paddi>s; transition: border .5s ease .1s, max-width .5s ease .1s, paddi
>ng .5s linear .1s } .quicknav dt, .quicknav dd { margin: 0; paddi>ng .5s linear .1s } .quicknav dt, .quicknav dd { margin: 0; paddi
>ng: 0; white-space: nowrap } .quicknav dt { font-weight: 700 } .q>ng: 0; white-space: nowrap } .quicknav dt { font-weight: 700 } .q
>uicknav dd + dt { margin-top: .5em } .quicknav:hover dl { max-wid>uicknav dd + dt { margin-top: .5em } .quicknav:hover dl { max-wid
>th: 300px; padding: 10px 20px 10px 10px; border-color: #ECECE7 } >th: 300px; padding: 10px 20px 10px 10px; border-color: #ECECE7 } 
>.quicknav .showme { display: block; position: absolute; top: 10px>.quicknav .showme { display: block; position: absolute; top: 10px
>; left: -31px; width: 30px; font: 2em sans-serif; color: #CCC; te>; left: -31px; width: 30px; font: 2em sans-serif; color: #CCC; te
>xt-align: center; background: #FFF; border-radius: 5px 0 0 5px; b>xt-align: center; background: #FFF; border-radius: 5px 0 0 5px; b
>order: 1px solid #ECECE7; border-right: none } .quicknav:hover .s>order: 1px solid #ECECE7; border-right: none } .quicknav:hover .s
>howme { color: #333; } .cleared { clear: both } /* This style has>howme { color: #333; } .cleared { clear: both } /* This style has
> problem ! Style attribute of BR element is not work in Kuma */ .> problem ! Style attribute of BR element is not work in Kuma */ .
>clearLeft { clear: left } /* ltr page only ? */ /* span.comment {>clearLeft { clear: left } /* ltr page only ? */ /* span.comment {
> display:none; } */ #wikiArticle .breadcrumbs { display: block; m> display:none; } */ #wikiArticle .breadcrumbs { display: block; m
>argin-bottom: 1em } /* The HTML5 landing page has some special-ca>argin-bottom: 1em } /* The HTML5 landing page has some special-ca
>se stuff, handled here */ /* table.html5ArticleToc { border-width>se stuff, handled here */ /* table.html5ArticleToc { border-width
>: 5px }*/ table.html5ArticleToc { border-style: none; border-widt>: 5px }*/ table.html5ArticleToc { border-style: none; border-widt
>h: 0; background-color: transparent; border-color: transparent; w>h: 0; background-color: transparent; border-color: transparent; w
>idth: 100%;} .html5ArticleToc thead th { padding: .5em 1em } .htm>idth: 100%;} .html5ArticleToc thead th { padding: .5em 1em } .htm
>l5ArticleToc tbody td { vertical-align: middle } .html5ArticleToc>l5ArticleToc tbody td { vertical-align: middle } .html5ArticleToc
> ul { margin: 0; padding: 0 } .html5ArticleToc ul li { display: i> ul { margin: 0; padding: 0 } .html5ArticleToc ul li { display: i
>nline; margin: 0 .25em } /* The syntax box: the first one is now >nline; margin: 0 .25em } /* The syntax box: the first one is now 
>used anywhere (DOM, JS, CSS, ...) The twoparts is used for CSS pr>used anywhere (DOM, JS, CSS, ...) The twoparts is used for CSS pr
>operties */ pre.syntaxbox { margin-bottom: 1em; background-color:>operties */ pre.syntaxbox { margin-bottom: 1em; background-color:
> #ffe; } pre.twopartsyntaxbox { margin-bottom: 0; background-colo> #ffe; } pre.twopartsyntaxbox { margin-bottom: 0; background-colo
>r: #ffe; } pre.twopartsyntaxbox + pre { border-top: none; margin->r: #ffe; } pre.twopartsyntaxbox + pre { border-top: none; margin-
>top: 0 } /* Allow the content of the syntax box to wrap, to preve>top: 0 } /* Allow the content of the syntax box to wrap, to preve
>nt horizontal scrolling */ pre.syntaxbox code[class*="language-"]>nt horizontal scrolling */ pre.syntaxbox code[class*="language-"]
>, pre.twopartsyntaxbox code[class*="language-"] { white-space:pre>, pre.twopartsyntaxbox code[class*="language-"] { white-space:pre
>-line; } table.withoutBorder, table.withoutBorder td, table.witho>-line; } table.withoutBorder, table.withoutBorder td, table.witho
>utBorder tr, table.withoutBorder th { border: none } td.horizonta>utBorder tr, table.withoutBorder th { border: none } td.horizonta
>lLine { border-left: none } td.column { border-bottom: none } td.>lLine { border-left: none } td.column { border-bottom: none } td.
>bottomPart { border-top: none } /* Use the verticalText class on >bottomPart { border-top: none } /* Use the verticalText class on 
>a table cell to rotate its contents 90° */ td.verticalText { widt>a table cell to rotate its contents 90° */ td.verticalText { widt
>h: 3em; -webkit-transform: rotate(-90deg); -moz-transform: rotate>h: 3em; -webkit-transform: rotate(-90deg); -moz-transform: rotate
>(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg)>(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg)
> } table.blockTable { border-collapse: collapse } table.blockTabl> } table.blockTable { border-collapse: collapse } table.blockTabl
>e, table.blockTable td { margin: 1px; padding: 1px } table.blockT>e, table.blockTable td { margin: 1px; padding: 1px } table.blockT
>able .verticalColumn { border-left: none; border-right: none } /*>able .verticalColumn { border-left: none; border-right: none } /*
> The index page for HTML / CSS */ div.index { -webkit-columns: 18> The index page for HTML / CSS */ div.index { -webkit-columns: 18
>em; -moz-column-width: 18em; columns: 18em } div.index > span >em; -moz-column-width: 18em; columns: 18em } div.index > span 
>{ font-family: Georgia, Times, 'Times New Roman', serif; font-siz>{ font-family: Georgia, Times, 'Times New Roman', serif; font-siz
>e: 1.6em } div.index ul, div.index ol { margin-left: 0; padding-l>e: 1.6em } div.index ul, div.index ol { margin-left: 0; padding-l
>eft: 0; list-style-type: none } /* Stuff used for the syntax info>eft: 0; list-style-type: none } /* Stuff used for the syntax info
>rmation about CSS, HTML, and so forth */ /* ul.cssprop box used b>rmation about CSS, HTML, and so forth */ /* ul.cssprop box used b
>y each CSS Property reference page*/ .cssprop { background-color:>y each CSS Property reference page*/ .cssprop { background-color:
> rgba(255, 203, 0, 0.1); } [dir="ltr"] .cssprop { clear: left; bo> rgba(255, 203, 0, 0.1); } [dir="ltr"] .cssprop { clear: left; bo
>rder-left: 6px solid rgba(255,203,0,0.5); } [dir="rtl"] .cssprop >rder-left: 6px solid rgba(255,203,0,0.5); } [dir="rtl"] .cssprop 
>{ clear: right; border-right:6px solid rgba(255,203,0,0.5); } .cs>{ clear: right; border-right:6px solid rgba(255,203,0,0.5); } .cs
>sprop li { display: table-row; padding: 3px; margin: 0 } .cssprop>sprop li { display: table-row; padding: 3px; margin: 0 } .cssprop
> li dfn { display: table-cell; padding: 0 5px; border-bottom: non> li dfn { display: table-cell; padding: 0 5px; border-bottom: non
>e; white-space: pre; cursor: inherit } .cssprop li dfn:after { co>e; white-space: pre; cursor: inherit } .cssprop li dfn:after { co
>ntent: ":" } .cssprop li li { display: list-item; list-style-type>ntent: ":" } .cssprop li li { display: list-item; list-style-type
>: disc; line-height: 1 } /* ul.htmlelt box used by each HTML Elem>: disc; line-height: 1 } /* ul.htmlelt box used by each HTML Elem
>ent reference page */ .htmlelt { display: table; padding: 11px 22>ent reference page */ .htmlelt { display: table; padding: 11px 22
>px; background-color:rgba(255,149,0,0.1); } [dir="ltr"] .htmlelt >px; background-color:rgba(255,149,0,0.1); } [dir="ltr"] .htmlelt 
>{ clear: left; border-left:6px solid rgba(255,149,0,0.5); } [dir=>{ clear: left; border-left:6px solid rgba(255,149,0,0.5); } [dir=
>"rtl"] .htmlelt { clear: right; border-right:6px solid rgba(255,1>"rtl"] .htmlelt { clear: right; border-right:6px solid rgba(255,1
>49,0,0.5); } .htmlelt li { display: table-row; padding: 3px; marg>49,0,0.5); } .htmlelt li { display: table-row; padding: 3px; marg
>in: 0; text-align: left } .htmlelt li dfn { display: table-cell; >in: 0; text-align: left } .htmlelt li dfn { display: table-cell; 
>padding: 0 5px; border-bottom: none; white-space: pre; cursor: in>padding: 0 5px; border-bottom: none; white-space: pre; cursor: in
>herit } .htmlelt li dfn:after { content: ":" } .htmlelt li li { d>herit } .htmlelt li dfn:after { content: ":" } .htmlelt li li { d
>isplay: list-item; list-style-type: disc; line-height: 1 } /* ul.>isplay: list-item; list-style-type: disc; line-height: 1 } /* ul.
>audionodebox used by each AudioNode object reference page*/ .audi>audionodebox used by each AudioNode object reference page*/ .audi
>onodebox { display: table; padding: 11px 22px; background-color:r>onodebox { display: table; padding: 11px 22px; background-color:r
>gba(117,195,165,0.1); } [dir="ltr"] .audionodebox { clear: left; >gba(117,195,165,0.1); } [dir="ltr"] .audionodebox { clear: left; 
>border-left:6px solid rgba(117,195,165,0.5); } [dir="rtl"] .audio>border-left:6px solid rgba(117,195,165,0.5); } [dir="rtl"] .audio
>nodebox { clear: right; border-right:6px solid rgba(117,195,165,0>nodebox { clear: right; border-right:6px solid rgba(117,195,165,0
>.5); } .audionodebox li, .summary-box-js li, .summary-box-events >.5); } .audionodebox li, .summary-box-js li, .summary-box-events 
>li { display: table-row; padding: 3px; margin: 0; text-align: lef>li { display: table-row; padding: 3px; margin: 0; text-align: lef
>t } .audionodebox li dfn, .summary-box-js li dfn, .summary-box-ev>t } .audionodebox li dfn, .summary-box-js li dfn, .summary-box-ev
>ents li dfn { display: table-cell; padding: 0 5px; border-bottom:>ents li dfn { display: table-cell; padding: 0 5px; border-bottom:
> none; white-space: pre; cursor: inherit } .audionodebox li dfn:a> none; white-space: pre; cursor: inherit } .audionodebox li dfn:a
>fter, .summary-box-js li dfn:after, .summary-box-events li dfn:af>fter, .summary-box-js li dfn:after, .summary-box-events li dfn:af
>ter { content: ":" } .audionodebox li li, .summary-box-js li li, >ter { content: ":" } .audionodebox li li, .summary-box-js li li, 
>.summary-box-events li li { display: list-item; list-style-type: >.summary-box-events li li { display: list-item; list-style-type: 
>disc; line-height: 1 } /* https://developer.mozilla.org/en-US/doc>disc; line-height: 1 } /* https://developer.mozilla.org/en-US/doc
>s/Template:HTML:Element_Navigation */ table.HTMLElmNav { margin: >s/Template:HTML:Element_Navigation */ table.HTMLElmNav { margin: 
>1em auto; border-width: 5px } table.HTMLElmNav th, table.HTMLElmN>1em auto; border-width: 5px } table.HTMLElmNav th, table.HTMLElmN
>av td { text-align: center } .method { margin-left: 10px; margin->av td { text-align: center } .method { margin-left: 10px; margin-
>bottom: 2em; margin-top: 1em } .method > .name { display: bloc>bottom: 2em; margin-top: 1em } .method > .name { display: bloc
>k; font-size: 13pt; margin-bottom: .2em } .method > .name >>k; font-size: 13pt; margin-bottom: .2em } .method > .name >
> .param: after { content: ","; padding-right: .5em } .method >> .param: after { content: ","; padding-right: .5em } .method >
> .name > .param: last-of-type: after { content: "" } .method &> .name > .param: last-of-type: after { content: "" } .method &
>gt; .name > .param > .name: after { content: " as "; font-w>gt; .name > .param > .name: after { content: " as "; font-w
>eight: normal } .method > .name > .param: not(.required) { >eight: normal } .method > .name > .param: not(.required) { 
>font-style: italic } .method > .name > .param: not(.require>font-style: italic } .method > .name > .param: not(.require
>d): before { content: "[" } .method > .name > .param: not(.>d): before { content: "[" } .method > .name > .param: not(.
>required): after { content: "]" } .method > .description { dis>required): after { content: "]" } .method > .description { dis
>play: block; font-size: 10pt; color: #444; font-style: italic; ma>play: block; font-size: 10pt; color: #444; font-style: italic; ma
>rgin-bottom: 7px } .method > .name > .returns: before { con>rgin-bottom: 7px } .method > .name > .returns: before { con
>tent: " returns "; font-weight: normal; font-style: italic } .met>tent: " returns "; font-weight: normal; font-style: italic } .met
>hod > .name > .returns { font-weight: 700 } .method > .p>hod > .name > .returns { font-weight: 700 } .method > .p
>arams { display: block; color: #555 } .method > .params > .>arams { display: block; color: #555 } .method > .params > .
>param { display: block; margin-bottom: 5px } .method > .params>param { display: block; margin-bottom: 5px } .method > .params
> > .param > .name { font-weight: 700; margin-right: .5em; m> > .param > .name { font-weight: 700; margin-right: .5em; m
>in-width: 80px; display: inline-block } .method > .params >>in-width: 80px; display: inline-block } .method > .params >
> .param > .description { display: inline-block; width: 300px; > .param > .description { display: inline-block; width: 300px; 
>vertical-align: top; margin-right: 30px } .method > .params &g>vertical-align: top; margin-right: 30px } .method > .params &g
>t; .param > .type { display: inline-block; width: 150px; verti>t; .param > .type { display: inline-block; width: 150px; verti
>cal-align: top; font-weight: 700 } .method > .params > .par>cal-align: top; font-weight: 700 } .method > .params > .par
>am > .type: before { content: "Type "; color: #888; font-weigh>am > .type: before { content: "Type "; color: #888; font-weigh
>t: normal } .method > .params > .param > .default { disp>t: normal } .method > .params > .param > .default { disp
>lay: inline-block; width: 150px; vertical-align: top; font-weight>lay: inline-block; width: 150px; vertical-align: top; font-weight
>: 700 } .method > .params > .param > .default: before { >: 700 } .method > .params > .param > .default: before { 
>content: "Default "; color: #888; font-weight: normal } /* versio>content: "Default "; color: #888; font-weight: normal } /* versio
>n compatibility banners and notes */ .geckoVersionNote { backgrou>n compatibility banners and notes */ .geckoVersionNote { backgrou
>nd-color: #E0E0FF; background-image: -moz-radial-gradient(0px 0 4>nd-color: #E0E0FF; background-image: -moz-radial-gradient(0px 0 4
>5deg, circle farthest-corner, #E0E0FF 0%, #F8F8FF 80%); border-le>5deg, circle farthest-corner, #E0E0FF 0%, #F8F8FF 80%); border-le
>ft: 5px solid #008 } .geckoVersionNote p { padding-left: 4px; bor>ft: 5px solid #008 } .geckoVersionNote p { padding-left: 4px; bor
>der: 0 } .geckoVersionHeading { background-color: #008; backgroun>der: 0 } .geckoVersionHeading { background-color: #008; backgroun
>d-image: -moz-linear-gradient(left, #008 50%, #e0e0ff 80%); color>d-image: -moz-linear-gradient(left, #008 50%, #e0e0ff 80%); color
>: #fff; font: 16px/1.7 Verdana, Tahoma, sans-serif; margin-top: 0>: #fff; font: 16px/1.7 Verdana, Tahoma, sans-serif; margin-top: 0
>; margin-left: 0; margin-bottom: 4px; height: 42px } .geckoVersio>; margin-left: 0; margin-bottom: 4px; height: 42px } .geckoVersio
>nHeading a:link { color: #ddd } .geckoVersionHeading a:visited { >nHeading a:link { color: #ddd } .geckoVersionHeading a:visited { 
>color: #eee } .geckoVersionHeading a:hover, .geckoVersionHeading >color: #eee } .geckoVersionHeading a:hover, .geckoVersionHeading 
>a:focus { color: #fdd } .experimentalIcon { display: inline-block>a:focus { color: #fdd } .experimentalIcon { display: inline-block
>; width:4px; height:4px; color:orange; background-color:white; bo>; width:4px; height:4px; color:orange; background-color:white; bo
>rder: 3px solid orange; } .nonstandardIcon { display: inline-bloc>rder: 3px solid orange; } .nonstandardIcon { display: inline-bloc
>k; width:8px; height:8px; color:red; background-color:red; border>k; width:8px; height:8px; color:red; background-color:red; border
>: 1px solid red; } .obsoleteIcon { display: inline-block; width:8>: 1px solid red; } .obsoleteIcon { display: inline-block; width:8
>px; height:8px; color:black; background-color:black; border: 1px >px; height:8px; color:black; background-color:black; border: 1px 
>solid black; } .deprecatedIcon { display: inline-block; width:4px>solid black; } .deprecatedIcon { display: inline-block; width:4px
>; height:4px; color:black; background-color:white; border: 3px so>; height:4px; color:black; background-color:white; border: 3px so
>lid black; } /* Used to to create icon-badged APIs inline */ .ind>lid black; } /* Used to to create icon-badged APIs inline */ .ind
>exListRow { display: -ms-flexbox; display: -webkit-flex; display:>exListRow { display: -ms-flexbox; display: -webkit-flex; display:
> flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex> flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex
>-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; fl>-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; fl
>ex-wrap: wrap; -webkit-justify-content: flex-start; -ms-flex-pack>ex-wrap: wrap; -webkit-justify-content: flex-start; -ms-flex-pack
>: start; justify-content: flex-start; -webkit-align-content: stre>: start; justify-content: flex-start; -webkit-align-content: stre
>tch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit>tch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit
>-align-items: flex-start; -ms-flex-align: start; align-items: fle>-align-items: flex-start; -ms-flex-align: start; align-items: fle
>x-start; /*width:100%;*/ } .indexListTerm { -webkit-order: 0; -ms>x-start; /*width:100%;*/ } .indexListTerm { -webkit-order: 0; -ms
>-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 a>-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 a
>uto; flex: 0 1 auto; -webkit-align-self: flex-start; -ms-flex-ite>uto; flex: 0 1 auto; -webkit-align-self: flex-start; -ms-flex-ite
>m-align: start; align-self: flex-start; } .indexListBadges { -web>m-align: start; align-self: flex-start; } .indexListBadges { -web
>kit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto>kit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto
>; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; ->; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -
>ms-flex-item-align: auto; align-self: flex-end; padding-left: 6px>ms-flex-item-align: auto; align-self: flex-end; padding-left: 6px
>; margin-right:6px; } .badge { position: relative; top: -2px; dis>; margin-right:6px; } .badge { position: relative; top: -2px; dis
>play: inline-block; cursor: default; border: 1px solid #aaa; bord>play: inline-block; cursor: default; border: 1px solid #aaa; bord
>er-radius: 8px; padding: .1em .6em; font-size: 70%; font-weight: >er-radius: 8px; padding: .1em .6em; font-size: 70%; font-weight: 
>700; height: 1.4em; vertical-align: middle; line-height: 1.3; } .>700; height: 1.4em; vertical-align: middle; line-height: 1.3; } .
>badgeText { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphen>badgeText { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphen
>s: none; hyphens: none; } .banner { display:block; overflow:hidde>s: none; hyphens: none; } .banner { display:block; overflow:hidde
>n; font-size: 12px; font-weight: normal; margin: 10px 0px; paddin>n; font-size: 12px; font-weight: normal; margin: 10px 0px; paddin
>g: 2px 10px; } .bannerHeading { text-align: inherit; font-weight:>g: 2px 10px; } .bannerHeading { text-align: inherit; font-weight:
> bold; padding-bottom: 2px; } .bannerText { text-align: center; f> bold; padding-bottom: 2px; } .bannerText { text-align: center; f
>ont-weight: normal; } .icon { padding-left: 3.1em } [dir=rtl] .ic>ont-weight: normal; } .icon { padding-left: 3.1em } [dir=rtl] .ic
>on { padding-left: .8em; padding-right: 3.1em; } .icon:before { c>on { padding-left: .8em; padding-right: 3.1em; } .icon:before { c
>ontent: ""; position: absolute; left: -2px; top: 50%; margin-top:>ontent: ""; position: absolute; left: -2px; top: 50%; margin-top:
> -1.5em; width: 2.8em; height: 2.8em; background: white no-repeat> -1.5em; width: 2.8em; height: 2.8em; background: white no-repeat
> center center; background-size: 2.6em; border-radius: 100%; bord> center center; background-size: 2.6em; border-radius: 100%; bord
>er: 1px solid #aaa; border-right: none; box-sizing: border-box; ->er: 1px solid #aaa; border-right: none; box-sizing: border-box; -
>moz-boxsizing: border-box; } [dir=rtl] .icon:before { left: auto;>moz-boxsizing: border-box; } [dir=rtl] .icon:before { left: auto;
> right: -2px; border: 1px solid #aaa; border-left: none; } /* Use> right: -2px; border: 1px solid #aaa; border-left: none; } /* Use
>d for badging obsolete APIs */ .nonstandardBadge { background: li>d for badging obsolete APIs */ .nonstandardBadge { background: li
>near-gradient(to right, #f0DE00 30%, #f0ff19); color: black; text>near-gradient(to right, #f0DE00 30%, #f0ff19); color: black; text
>-shadow: 1px 1px 0 #ddd; } /* Used for badging Gecko minimum vers>-shadow: 1px 1px 0 #ddd; } /* Used for badging Gecko minimum vers
>ion requirements */ .geckoVersionBadge { background: rgba(117,195>ion requirements */ .geckoVersionBadge { background: rgba(117,195
>,165,0.44); color: black; text-shadow: 1px 1px 0 #ddd; border:5px>,165,0.44); color: black; text-shadow: 1px 1px 0 #ddd; border:5px
> solid rgba(0,0,0,0.05); } /* Used for badging Firefox minimum ve> solid rgba(0,0,0,0.05); } /* Used for badging Firefox minimum ve
>rsion requirements */ .firefoxVersionBadge { background-color: #F>rsion requirements */ .firefoxVersionBadge { background-color: #F
>EDF9E; background-image: linear-gradient(to right, #FEDF9E 30%, #>EDF9E; background-image: linear-gradient(to right, #FEDF9E 30%, #
>FEF1D4); background-repeat: no-repeat; background-size: contain; >FEF1D4); background-repeat: no-repeat; background-size: contain; 
>overflow: hidden; color: black; text-shadow: 1px 1px 0 #ccc; whit>overflow: hidden; color: black; text-shadow: 1px 1px 0 #ccc; whit
>e-space: nowrap; } .firefoxVersionBadge a:link { color: black; te>e-space: nowrap; } .firefoxVersionBadge a:link { color: black; te
>xt-decoration: underline; } .firefoxVersionBadge a:visited { colo>xt-decoration: underline; } .firefoxVersionBadge a:visited { colo
>r: black; text-decoration: underline; } .firefoxVersionBadge a:ho>r: black; text-decoration: underline; } .firefoxVersionBadge a:ho
>ver { color: #853; text-decoration: none; } .firefoxVersionBadge >ver { color: #853; text-decoration: none; } .firefoxVersionBadge 
>a:active { color:#858; text-decoration: none; } /* Used for badgi>a:active { color:#858; text-decoration: none; } /* Used for badgi
>ng APIs not implemented in Firefox */ .unimplementedBadge { backg>ng APIs not implemented in Firefox */ .unimplementedBadge { backg
>round-color: lightpink; color: black; text-shadow: 1px 1px 0 #ddd>round-color: lightpink; color: black; text-shadow: 1px 1px 0 #ddd
>; border-color: deeppink; } /* Used for badging non-standard APIs>; border-color: deeppink; } /* Used for badging non-standard APIs
> */ .obsoleteBadge { background: linear-gradient(to right, #FEBCB> */ .obsoleteBadge { background: linear-gradient(to right, #FEBCB
>C 30%, #fffff0); color: black; text-shadow: 1px 1px 0 #ddd; borde>C 30%, #fffff0); color: black; text-shadow: 1px 1px 0 #ddd; borde
>r-color: #f00; } /* Used for badging deprecated APIs */ .deprecat>r-color: #f00; } /* Used for badging deprecated APIs */ .deprecat
>edBadge { background: linear-gradient(to right, #ccccff 30%, #eee>edBadge { background: linear-gradient(to right, #ccccff 30%, #eee
>eff); color: #000; text-shadow: 1px 1px 0 #ddd; border-color: blu>eff); color: #000; text-shadow: 1px 1px 0 #ddd; border-color: blu
>e; } /* Used for badging experimental APIs */ .experimentalBadge >e; } /* Used for badging experimental APIs */ .experimentalBadge 
>{ background: linear-gradient(to right, #ffefd9 40%, #fffde0); co>{ background: linear-gradient(to right, #ffefd9 40%, #fffde0); co
>lor: #000; text-shadow: 1px 1px 0 #ddd; } /* Used for badging pri>lor: #000; text-shadow: 1px 1px 0 #ddd; } /* Used for badging pri
>vileged APIs */ .privilegedBadge { background: linear-gradient(to>vileged APIs */ .privilegedBadge { background: linear-gradient(to
> right, #FFBD19 30%, #ffb200); color: #000; text-shadow: 1px 1px > right, #FFBD19 30%, #ffb200); color: #000; text-shadow: 1px 1px 
>0 #ddd; } [dir=rtl] .privilegedBadge { background: linear-gradien>0 #ddd; } [dir=rtl] .privilegedBadge { background: linear-gradien
>t(to left, #FFBD19 30%, #ffb200); } .icon.privilegedBadge:before >t(to left, #FFBD19 30%, #ffb200); } .icon.privilegedBadge:before 
>{ background-color: orange; background-image: url(https://mdn.moz>{ background-color: orange; background-image: url(https://mdn.moz
>illademos.org/files/5061/firefoxos-logo-sm.png); } .sidebar-box {>illademos.org/files/5061/firefoxos-logo-sm.png); } .sidebar-box {
> margin-left: 16px; margin-bottom: 2.5em; border-right: 1px solid> margin-left: 16px; margin-bottom: 2.5em; border-right: 1px solid
> #ecf1f3; padding: 12px; background: #f1f6f8 url("img/toc-bg.png"> #ecf1f3; padding: 12px; background: #f1f6f8 url("img/toc-bg.png"
>) 0 0 no-repeat; font: 12px Verdana, Tahoma, sans-serif } .sideba>) 0 0 no-repeat; font: 12px Verdana, Tahoma, sans-serif } .sideba
>r-box h2, .sidebar-box h3, .sidebar-box h5 { margin-bottom: .5em;>r-box h2, .sidebar-box h3, .sidebar-box h5 { margin-bottom: .5em;
> font-family: inherit; font-weight: 700 } .sidebar-box h2 { font-> font-family: inherit; font-weight: 700 } .sidebar-box h2 { font-
>size: 1.5em } .sidebar-box h3 { font-size: 1.1em } .sidebar-box h>size: 1.5em } .sidebar-box h3 { font-size: 1.1em } .sidebar-box h
>5 { font-size: .9em } .sidebar-box > ul { float: left; text-al>5 { font-size: .9em } .sidebar-box > ul { float: left; text-al
>ign: left; display: block; padding: 0; margin: auto 0; position: >ign: left; display: block; padding: 0; margin: auto 0; position: 
>relative } .sidebar-box ul > li { list-style-type: none } .tab>relative } .sidebar-box ul > li { list-style-type: none } .tab
>-content-box { border-right: 1px solid #ecf1f3; margin-left: 16px>-content-box { border-right: 1px solid #ecf1f3; margin-left: 16px
>; padding: 12px; background: #fff; font: 12px Verdana, Tahoma, sa>; padding: 12px; background: #fff; font: 12px Verdana, Tahoma, sa
>ns-serif } .tab-content-box h2, .tab-content-box h3, .tab-content>ns-serif } .tab-content-box h2, .tab-content-box h3, .tab-content
>-box h5 { margin-bottom: .5em; font-family: inherit; font-weight:>-box h5 { margin-bottom: .5em; font-family: inherit; font-weight:
> 700 } .tab-content-box h2 { font-size: 1.5em } .tab-content-box > 700 } .tab-content-box h2 { font-size: 1.5em } .tab-content-box 
>h3 { font-size: 1.1em } .tab-content-box h5 { font-size: .9em } />h3 { font-size: 1.1em } .tab-content-box h5 { font-size: .9em } /
>* Horizontal tab boxes */ .htab { margin: 0 auto 1em; display: in>* Horizontal tab boxes */ .htab { margin: 0 auto 1em; display: in
>line-block; } .htab>ul>li { width: 150px; height: 28px; lis>line-block; } .htab>ul>li { width: 150px; height: 28px; lis
>t-style-type: none; display: inline; padding-bottom: 3px; border:>t-style-type: none; display: inline; padding-bottom: 3px; border:
> 1px solid #ddd; border-radius: 3px 3px 0 0; padding-top: 5px; te> 1px solid #ddd; border-radius: 3px 3px 0 0; padding-top: 5px; te
>xt-align: left; font-size: 13px; font-weight: normal; margin: aut>xt-align: left; font-size: 13px; font-weight: normal; margin: aut
>o; position: relative; padding-left: 6px; padding-right: 6px; bor>o; position: relative; padding-left: 6px; padding-right: 6px; bor
>der-bottom: none; opacity: .5; -ms-filter: "progid:DXImageTransfo>der-bottom: none; opacity: .5; -ms-filter: "progid:DXImageTransfo
>rm.Microsoft.Alpha(Opacity=50)"; filter: progid:DXImageTransform.>rm.Microsoft.Alpha(Opacity=50)"; filter: progid:DXImageTransform.
>Microsoft.Alpha(Opacity=50); } .htab>ul>li.selected { opaci>Microsoft.Alpha(Opacity=50); } .htab>ul>li.selected { opaci
>ty: 1 !important; -ms-filter: "progid:DXImageTransform.Microsoft.>ty: 1 !important; -ms-filter: "progid:DXImageTransform.Microsoft.
>Alpha(Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Al>Alpha(Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Al
>pha(Opacity=100); border: 1px solid #ddd; border-bottom: none; z->pha(Opacity=100); border: 1px solid #ddd; border-bottom: none; z-
>index: 10; background-color: rgba(234, 239, 242,1) !important; po>index: 10; background-color: rgba(234, 239, 242,1) !important; po
>sition: relative; font-weight: bold; } .htab>ul>li>a { c>sition: relative; font-weight: bold; } .htab>ul>li>a { c
>ursor: pointer; } .htab>ul>li.selected a { color: #000; } .>ursor: pointer; } .htab>ul>li.selected a { color: #000; } .
>htab>ul { width: 150px; text-align: left; display: inline; pad>htab>ul { width: 150px; text-align: left; display: inline; pad
>ding: 0; margin: 0 auto; position: relative; top: 0; } .htab>d>ding: 0; margin: 0 auto; position: relative; top: 0; } .htab>d
>iv { background-color: #f1f6f8; margin-top: 0; border: 1px solid >iv { background-color: #f1f6f8; margin-top: 0; border: 1px solid 
>#ddd; padding: 12px; position: relative; z-index: 9; word-wrap: b>#ddd; padding: 12px; position: relative; z-index: 9; word-wrap: b
>reak-word; } /* Compatibility tables */ table.compat-table { bord>reak-word; } /* Compatibility tables */ table.compat-table { bord
>er: 1px solid #bbb; border-collapse: collapse; } table.compat-tab>er: 1px solid #bbb; border-collapse: collapse; } table.compat-tab
>le { border-color: rgba(0,0,0,0); margin: 0 } table.compat-table >le { border-color: rgba(0,0,0,0); margin: 0 } table.compat-table 
>td { padding: 5px; border: 1px solid rgba(212,221,228,0.25); font>td { padding: 5px; border: 1px solid rgba(212,221,228,0.25); font
>-size:12px; background: #fff; vertical-align: top; word-wrap: bre>-size:12px; background: #fff; vertical-align: top; word-wrap: bre
>ak-word } table.compat-table th, table.compat-table td.header { b>ak-word } table.compat-table th, table.compat-table td.header { b
>order:1px solid rgba(212,221,228,0); background:none; font-weight>order:1px solid rgba(212,221,228,0); background:none; font-weight
>:200; font-family:'Open Sans Light',sans-serif; font-size:16px; l>:200; font-family:'Open Sans Light',sans-serif; font-size:16px; l
>ine-height:100%; padding:2px 4px 8px; } div.action-driven { displ>ine-height:100%; padding:2px 4px 8px; /* From content.styl backgr
>ay: inline-block; float: none; min-height: 8.5em; margin: .8em; b>ound: rgba(212, 221, 228, 0.5); font-weight: 700; */ } div.action
>ox-shadow: .2em .1em .1em #808080; vertical-align: top; } div.act>-driven { display: inline-block; float: none; min-height: 8.5em; 
>ion-driven > div { font: 400 20px 'Bebas Neue', 'League Gothic>margin: .8em; box-shadow: .2em .1em .1em #808080; vertical-align:
>', Haettenschweiler, Impact, 'Arial Narrow', Meiryo, sans-serif; > top; } div.action-driven > div { font: 400 20px 'Bebas Neue',
>text-transform: uppercase } /* standard coloring */ .notice.exper> 'League Gothic', Haettenschweiler, Impact, 'Arial Narrow', Meiry
>imental { color: 0; background-color:rgba(255,203,0,0.5); border->o, sans-serif; text-transform: uppercase } /* standard coloring *
>color:rgba(0,0,0,0.05); border-style:solid!important; border-widt>/ .notice.experimental { color: 0; background-color:rgba(255,203,
>h:5px!important; } /* New theme action-driven */ .card-grid > >0,0.5); border-color:rgba(0,0,0,0.05); border-style:solid!importa
>li > span:first-of-type {font-weight: bold} ul.card-grid {list>nt; border-width:5px!important; } /* New theme action-driven */ .
>-style-type: none; padding-left: 0;} ul.card-grid li {margin-bott>card-grid > li > span:first-of-type {font-weight: bold} ul.
>om: 25px; padding: 10px;} @media only screen and (min-width:760px>card-grid {list-style-type: none; padding-left: 0;} ul.card-grid 
>) { ul.card-grid { list-style: none outside none; padding-left: 4>li {margin-bottom: 25px; padding: 10px;} @media only screen and (
>0px; } .card-grid { border-spacing: 30px 0px; padding-bottom: 25p>min-width:760px) { ul.card-grid { list-style: none outside none; 
>x; } .card-grid > li > span:first-of-type {font-weight: nor>padding-left: 40px; } .card-grid { border-spacing: 30px 0px; padd
>mal} .card-grid > li { background-color: rgb(204, 204, 204); b>ing-bottom: 25px; } .card-grid > li > span:first-of-type {f
>ackground-image: -moz-linear-gradient(center top , rgb(221, 221, >ont-weight: normal} .card-grid > li { background-color: rgb(20
>221) 0px, rgb(187, 187, 187) 100%); border-radius: 6px; backgroun>4, 204, 204); background-image: -moz-linear-gradient(center top ,
>d-clip: padding-box; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1); > rgb(221, 221, 221) 0px, rgb(187, 187, 187) 100%); border-radius:
>display: table-cell; margin: 3px 12px 20px; padding: 20px; positi> 6px; background-clip: padding-box; box-shadow: 0px 2px 4px rgba(
>on: relative; vertical-align: top; width: 200px; word-wrap: break>0, 0, 0, 0.1); display: table-cell; margin: 3px 12px 20px; paddin
>-word; z-index: 1; min-height: 130px; } .card-grid > li:before>g: 20px; position: relative; vertical-align: top; width: 200px; w
> { left: 1px; position: absolute; right: 1px; top: 1px; z-index: >ord-wrap: break-word; z-index: 1; min-height: 130px; } .card-grid
>-1; } .card-grid > li img { float:left; max-width: 35%; } .dou> > li:before { left: 1px; position: absolute; right: 1px; top:
>ble-card { width: 430px !important; } .card-grid > li > ul > 1px; z-index: -1; } .card-grid > li img { float:left; max-wid
>> li { margin-bottom: 0px; list-style-type: disc; padding-bott>th: 35%; } .double-card { width: 430px !important; } .card-grid &
>om: 0px; padding-top: 6px; } .card-grid > li > ul { margin->gt; li > ul > li { margin-bottom: 0px; list-style-type: dis
>bottom: 25px; } .card-grid > li span { display: block; font-fa>c; padding-bottom: 0px; padding-top: 6px; } .card-grid > li &g
>mily: 'Open Sans Light',Arial,Helvetica,sans-serif; font-size: 22>t; ul { margin-bottom: 25px; } .card-grid > li span { display:
>px; letter-spacing: -1px; line-height: 22px; margin-bottom: 12px;> block; font-family: 'Open Sans Light',Arial,Helvetica,sans-serif
> } } .card-grid > li { background-color:rgba(234,239,242,0.5);>; font-size: 22px; letter-spacing: -1px; line-height: 22px; margi
> border-radius: 0; box-shadow:3px 3px 0 3px rgba(212,221,228,0.5)>n-bottom: 12px; } } .card-grid > li { background-color:rgba(23
>; background-image: none; } /*----------------- for Topic page */>4,239,242,0.5); border-radius: 0; box-shadow:3px 3px 0 3px rgba(2
> table.topicpage-table, table.topicpage-table td, table.topicpage>12,221,228,0.5); background-image: none; } /*----------------- fo
>-table tr, table.topicpage-table th { border: none } .topicpage-t>r Topic page */ table.topicpage-table, table.topicpage-table td, 
>able .section { padding-right:1em} /* New theme */ dl { margin-bo>table.topicpage-table tr, table.topicpage-table th { border: none
>ttom: 20px} .center .topicpage-table h2 { font-family: 'Open Sans> } .topicpage-table .section { padding-right:1em} /* New theme */
> Light', sans-serif } .topicpage-table ul {padding-left: 20px; } > dl { margin-bottom: 20px} .center .topicpage-table h2 { font-fam
>.topicpage2col { margin: 1em 0; padding: 0 10px; zoom: 1; } .topi>ily: 'Open Sans Light', sans-serif } .topicpage-table ul {padding
>cpage2col::after { content: "."; display: block; height: 0; clear>-left: 20px; } .topicpage2col { margin: 1em 0; padding: 0 10px; z
>: both; visibility: hidden; } .topicpage2col .A, .topicpage2col .>oom: 1; } .topicpage2col::after { content: "."; display: block; h
>B { width: 50%; position: relative } .html-ltr .topicpage2col .A,>eight: 0; clear: both; visibility: hidden; } .topicpage2col .A, .
> .html-rtl .topicpage2col .B { float: left; left: -10px } .html-l>topicpage2col .B { width: 50%; position: relative } .html-ltr .to
>tr .topicpage2col .B, .html-rtl .topicpage2col .A { float: right;>picpage2col .A, .html-rtl .topicpage2col .B { float: left; left: 
> right: -10px } .topicpage2col h2 { background-image: url('/media>-10px } .html-ltr .topicpage2col .B, .html-rtl .topicpage2col .A 
>/img/icons-sections.png'); background-repeat: no-repeat; margin: >{ float: right; right: -10px } .topicpage2col h2 { background-ima
>0 0 .25em; padding: 18px 18px 0 65px; min-height: 48px; font: 400>ge: url('/media/img/icons-sections.png'); background-repeat: no-r
> 28px/1 'Bebas Neue', 'League Gothic', Haettenschweiler, Impact, >epeat; margin: 0 0 .25em; padding: 18px 18px 0 65px; min-height: 
>'Arial Narrow', Meiryo, sans-serif; text-transform: uppercase; bo>48px; font: 400 28px/1 'Bebas Neue', 'League Gothic', Haettenschw
>rder: none } .html-rtl .topicpage2col h2 { padding: 18px 65px 0 1>eiler, Impact, 'Arial Narrow', Meiryo, sans-serif; text-transform
>8px; } .html-ltr .topicpage2col .Documentation { background-posit>: uppercase; border: none } .html-rtl .topicpage2col h2 { padding
>ion: 0 0 } .html-ltr .topicpage2col .Community { background-posit>: 18px 65px 0 18px; } .html-ltr .topicpage2col .Documentation { b
>ion: 0 -200px } .html-ltr .topicpage2col .Tools { background-posi>ackground-position: 0 0 } .html-ltr .topicpage2col .Community { b
>tion: 0 -400px } .html-ltr .topicpage2col .Related_Topics { backg>ackground-position: 0 -200px } .html-ltr .topicpage2col .Tools { 
>round-position: 0 -600px } .html-rtl .topicpage2col .Documentatio>background-position: 0 -400px } .html-ltr .topicpage2col .Related
>n { background-position: right 0 } .html-rtl .topicpage2col .Comm>_Topics { background-position: 0 -600px } .html-rtl .topicpage2co
>unity { background-position: right -200px } .html-rtl .topicpage2>l .Documentation { background-position: right 0 } .html-rtl .topi
>col .Tools { background-position: right -400px } .html-rtl .topic>cpage2col .Community { background-position: right -200px } .html-
>page2col .Related_Topics { background-position: right -600px } /*>rtl .topicpage2col .Tools { background-position: right -400px } .
> ---------------------------- Styles for Indicator */ .inlineIndi>html-rtl .topicpage2col .Related_Topics { background-position: ri
>cator, .indicatorInHeadline, .blockIndicator, .overheadIndicator >ght -600px } /* ---------------------------- Styles for Indicator
>{ /*box-shadow: 1px 1px 1px #CCC*/ margin: 0px 0px 1.5em; border:> */ .inlineIndicator, .indicatorInHeadline, .blockIndicator, .ove
> 5px solid; padding: 10px 10px 0px 10px; background: none repeat >rheadIndicator { /*box-shadow: 1px 1px 1px #CCC*/ margin: 0px 0px
>scroll 0% 0%; font-size: 12px; } .redesign .inlineIndicator, .red> 1.5em; border: 5px solid; padding: 10px 10px 0px 10px; backgroun
>esign .indicatorInHeadline, .redesign .blockIndicator, .redesign >d: none repeat scroll 0% 0%; font-size: 12px; } .redesign .inline
>.overheadIndicator { /* background-color:rgba(255,203,0,0.75); */>Indicator, .redesign .indicatorInHeadline, .redesign .blockIndica
> border-color:rgba(0,0,0,0.05); border-style: solid !important; />tor, .redesign .overheadIndicator { /* background-color:rgba(255,
>* font-size: 11px; */ padding: 10px; } .redesign .inlineIndicator>203,0,0.75); */ border-color:rgba(0,0,0,0.05); border-style: soli
>, .redesign .indicatorInHeadline { border-width: 0; border-left-w>d !important; /* font-size: 11px; */ padding: 10px; } .redesign .
>idth: 4px; font-size: 10px; font-family: Helvetica, Arial, sans-s>inlineIndicator, .redesign .indicatorInHeadline { border-width: 0
>erif; min-width: 20px; border-radius: 2px; letter-spacing: 1px; p>; border-left-width: 4px; font-size: 10px; font-family: Helvetica
>adding: 6px 6px 4px 6px; display: inline-block; vertical-align: t>, Arial, sans-serif; min-width: 20px; border-radius: 2px; letter-
>op; margin-left: 11px; border-top-width: 0; border-right-width: 0>spacing: 1px; padding: 6px 6px 4px 6px; display: inline-block; ve
>; border-bottom-width: 0; font-weight: normal; line-height: norma>rtical-align: top; margin-left: 11px; border-top-width: 0; border
>l; } /* styles for inline indicator */ .inlineIndicator /* This c>-right-width: 0; border-bottom-width: 0; font-weight: normal; lin
>lass is base of inlineIndicator */ , .megaWarningInline { border->e-height: normal; } /* styles for inline indicator */ .inlineIndi
>width: 1px; border-style: solid; font-size: 12px; white-space: no>cator /* This class is base of inlineIndicator */ , .megaWarningI
>wrap; padding: 0 2px; margin: 0 2px } .todoInline { border-left-w>nline { border-width: 1px; border-style: solid; font-size: 12px; 
>idth: 8px; white-space: normal } .megaWarningInline { background:>white-space: nowrap; padding: 0 2px; margin: 0 2px } .todoInline 
> red; border-color: #818151; color: #fff; font-size: small; font->{ border-left-width: 8px; white-space: normal } .megaWarningInlin
>weight: 700; float: right; vertical-align: middle; /* Mega warnin>e { background: red; border-color: #818151; color: #fff; font-siz
>gs: deep red backgrounds etc */ } .notXPCOMInline, .noscriptInlin>e: small; font-weight: 700; float: right; vertical-align: middle;
>e { font-weight: 700 } /* styles for overhead indicator */ /*.ove> /* Mega warnings: deep red backgrounds etc */ } .notXPCOMInline,
>rheadIndicator *//* This class is base of overheadIndicator */ , > .noscriptInline { font-weight: 700 } /* styles for overhead indi
>.standardNoteHeader, .standardNoteBlock { border: 1px solid #000;>cator */ /*.overheadIndicator *//* This class is base of overhead
> overflow: hidden; margin: 10px 0; padding: 0 10px; text-align: c>Indicator */ , .standardNoteHeader, .standardNoteBlock { border: 
>enter } /*.overheadIndicator p,*/ .blockIndicator p { margin: 4px>1px solid #000; overflow: hidden; margin: 10px 0; padding: 0 10px
> 0 } .draftHeader strong { display: block; padding-top: 10px } .d>; text-align: center } /*.overheadIndicator p,*/ .blockIndicator 
>raftHeader div { font-size: x-small; padding-bottom: 10px } html[>p { margin: 4px 0 } .draftHeader strong { display: block; padding
>dir="rtl"] .warningHeader { padding: 1em 130px 1em 1em !important>-top: 10px } .draftHeader div { font-size: x-small; padding-botto
>; background-position: 99% 10px !important; } /* styles for Metho>m: 10px } html[dir="rtl"] .warningHeader { padding: 1em 130px 1em
>d indicator */ .indicatorInHeadline, .standardNoteMethod { border> 1em !important; background-position: 99% 10px !important; } /* s
>: 1px solid #000; padding: 1px 2px; white-space: nowrap; vertical>tyles for Method indicator */ .indicatorInHeadline, .standardNote
>-align: middle; font-size: 12px; float: right; } [dir="rtl"] .ind>Method { border: 1px solid #000; padding: 1px 2px; white-space: n
>icatorInHeadline, [dir="rtl"] .standardNoteMethod { float: left; >owrap; vertical-align: middle; font-size: 12px; float: right; } [
>} .renamedMethod, .noscriptMethod, .deprecatedMethod, .unimplemen>dir="rtl"] .indicatorInHeadline, [dir="rtl"] .standardNoteMethod 
>tedMethod { font-weight: 700 } /* color setting */ #wikiArticle i>{ float: left; } .renamedMethod, .noscriptMethod, .deprecatedMeth
>.icon-beaker { color: #09d } /* experimental */ #wikiArticle i.ic>od, .unimplementedMethod { font-weight: 700 } /* color setting */
>on-warning-sign { color: #db0 } /* non-standard */ #wikiArticle i> #wikiArticle i.icon-beaker { color: #09d } /* experimental */ #w
>.icon-thumbs-down-alt { color: #000 } /* deprecated */ #wikiArtic>ikiArticle i.icon-warning-sign { color: #db0 } /* non-standard */
>le i.icon-trash { color: #d00 } /* obsolete */ #wikiArticle i.ico> #wikiArticle i.icon-thumbs-down-alt { color: #000 } /* deprecate
>n-stethoscope { color: darkslateblue } /* unimplemented */ .draft>d */ #wikiArticle i.icon-trash { color: #d00 } /* obsolete */ #wi
> { background: #FFC; border-color: #990 } .redesign .draft { back>kiArticle i.icon-stethoscope { color: darkslateblue } /* unimplem
>ground:rgba(255,203,0,0.5); border-color:rgba(0,0,0,0.05); } .htm>ented */ .draft { background: #FFC; border-color: #990 } .redesig
>lVer { background: #CEE; border-color: #267373 } .redesign .htmlV>n .draft { background:rgba(255,203,0,0.5); border-color:rgba(0,0,
>er { border-color:rgba(0,0,0,0.05); } .nonStandard { background:r>0,0.05); } .htmlVer { background: #CEE; border-color: #267373 } .
>gba(193,56,50,0.85); color:#FFF; border-color:rgba(0,0,0,0.05); }>redesign .htmlVer { border-color:rgba(0,0,0,0.05); } .nonStandard
> .nonStandard a, .nonStandard a:hover, .nonStandard a:visited, .w> { background:rgba(193,56,50,0.85); color:#FFF; border-color:rgba
>arning a, .warning a:hover, .warning a:visited { color: yellow; b>(0,0,0,0.05); } .nonStandard a, .nonStandard a:hover, .nonStandar
>order-bottom: 1px solid yellow; text-decoration: none; } .unimple>d a:visited, .warning a, .warning a:hover, .warning a:visited { c
>mented { background:rgba(193,56,50,0.35); border-color:rgba(0,0,0>olor: yellow; border-bottom: 1px solid yellow; text-decoration: n
>,0.05); } .deprecated { background:rgba(0,0,0,0.1); border-color:>one; } .unimplemented { background:rgba(193,56,50,0.35); border-c
>rgba(0,0,0,0.05); } .domLevel { border-color:rgba(0,0,0,0.05); } >olor:rgba(0,0,0,0.05); } .deprecated { background:rgba(0,0,0,0.1)
>.todo { border-color:rgba(0,0,0,0.05); } .minVer, .jsMinVer, .mbM>; border-color:rgba(0,0,0,0.05); } .domLevel { border-color:rgba(
>inVer { background: #ffffe1; border-color:rgba(0,0,0,0.05); } .mo>0,0,0,0.05); } .todo { border-color:rgba(0,0,0,0.05); } .minVer, 
>bileOnly { border-color:rgba(0,0,0,0.05); background: #FFE1BE; } >.jsMinVer, .mbMinVer { background: #ffffe1; border-color:rgba(0,0
>.renamed { background: #d4f3ff; border-color: #818151 } .projectS>,0,0.05); } .mobileOnly { border-color:rgba(0,0,0,0.05); backgrou
>pecific { background: #ffe1be; border-color:rgba(0,0,0,0.05); } .>nd: #FFE1BE; } .renamed { background: #d4f3ff; border-color: #818
>prefixBox { background: #e4edf7; border-color:rgba(0,0,0,0.05); }>151 } .projectSpecific { background: #ffe1be; border-color:rgba(0
> .experimental { background: #ffefd9; border-color:rgba(0,0,0,0.0>,0,0,0.05); } .prefixBox { background: #e4edf7; border-color:rgba
>5); } .readOnly { background:rgba(0,0,0,0.65); border-color:rgba(>(0,0,0,0.05); } .experimental { background: #ffefd9; border-color
>0,0,0,0.15); color: #FFF} .noscript { background: red; border-col>:rgba(0,0,0,0.05); } .readOnly { background:rgba(0,0,0,0.65); bor
>or:rgba(0,0,0,0.05); color: #FFF } .projectSpecific{ background: >der-color:rgba(0,0,0,0.15); color: #FFF} .noscript { background: 
>#ffe1be; border-color: #818151; } /* Banner used to indicate supp>red; border-color:rgba(0,0,0,0.05); color: #FFF } .projectSpecifi
>ort only in specific Gecko projects */ .translationInProgress { b>c{ background: #ffe1be; border-color: #818151; } /* Banner used t
>ackground: #A3F5A3; border-color:rgba(0,0,0,0.05); } /* style for>o indicate support only in specific Gecko projects */ .translatio
> next and previous pages in tutorial */ a.nextPage { display: inl>nInProgress { background: #A3F5A3; border-color:rgba(0,0,0,0.05);
>ine-block; margin: 0 3px 1em; font-size: 1.25em } a.nextPage:link> } /* style for next and previous pages in tutorial */ a.nextPage
>, a.nextPage:visited { background-color: #069 } a.nextPage:hover,> { display: inline-block; margin: 0 3px 1em; font-size: 1.25em } 
> a.nextPage:focus { background-color: #0099E6 } a.nextPage { floa>a.nextPage:link, a.nextPage:visited { background-color: #069 } a.
>t:right } [dir="rtl"] a.nextPage { background-position: left 40% >nextPage:hover, a.nextPage:focus { background-color: #0099E6 } a.
>!important; padding: .35em .75em .2em !important; position: left;>nextPage { float:right } [dir="rtl"] a.nextPage { background-posi
>} a.previousPage { display: block; margin: 0 1em 2em 0; font-size>tion: left 40% !important; padding: .35em .75em .2em !important; 
>: 1.25em } a.previousPage:link, a.previousPage:visited { backgrou>position: left;} a.previousPage { display: block; margin: 0 1em 2
>nd-color: #069 } a.previousPage:hover, a.previousPage:focus { bac>em 0; font-size: 1.25em } a.previousPage:link, a.previousPage:vis
>kground-color: #0099E6 } a.previousPage { float:left } [dir="rtl">ited { background-color: #069 } a.previousPage:hover, a.previousP
>] a.previousPage { background-position: left 40% !important; padd>age:focus { background-color: #0099E6 } a.previousPage { float:le
>ing: .35em .75em .2em !important; position: right;} /* styles for>ft } [dir="rtl"] a.previousPage { background-position: left 40% !
> liveSample link : https://developer.mozilla.org/en-US/docs/Templ>important; padding: .35em .75em .2em !important; position: right;
>ate:LiveSample */ a.liveSample { display: inline-block; margin: 0>} /* styles for liveSample link : https://developer.mozilla.org/e
> 3px 1em; font-size: 1.25em } a.liveSample:link, a.liveSample:vis>n-US/docs/Template:LiveSample */ a.liveSample { display: inline-b
>ited { background-color: #069 } a.liveSample:hover, a.liveSample:>lock; margin: 0 3px 1em; font-size: 1.25em } a.liveSample:link, a
>focus { background-color: #0099E6 } [dir="rtl"] a.liveSample { ba>.liveSample:visited { background-color: #069 } a.liveSample:hover
>ckground-position: left 40% !important; padding: .35em .75em .2em>, a.liveSample:focus { background-color: #0099E6 } [dir="rtl"] a.
> !important; } /* callout boxes etc */ .standardSidebar { border:>liveSample { background-position: left 40% !important; padding: .
> 1px solid #777; margin: 0 0 15px 15px; padding: 0 15px 5px; floa>35em .75em .2em !important; } /* callout boxes etc */ .standardSi
>t: right; background: #eee; font-size: .85em; position: relative;>debar { border: 1px solid #777; margin: 0 0 15px 15px; padding: 0
> z-index: 2; } [dir="rtl"] .standardSidebar { margin: 0 15px 15px> 15px 5px; float: right; background: #eee; font-size: .85em; posi
> 0; float: left } /* Colored text for INCORRECT/BAD and CORRECT/G>tion: relative; z-index: 2; } [dir="rtl"] .standardSidebar { marg
>OOD values (and BEST)*/ .correct { color: green } .incorrect { co>in: 0 15px 15px 0; float: left } /* Colored text for INCORRECT/BA
>lor: red } .best { color: #396 } /* Item in a list of item that h>D and CORRECT/GOOD values (and BEST)*/ .correct { color: green } 
>as been done */ .done { text-decoration: line-through } /* Specif>.incorrect { color: red } .best { color: #396 } /* Item in a list
>ic items for tutorials */ .tuto_details, .tuto_example { border: > of item that has been done */ .done { text-decoration: line-thro
>1px solid #36b; padding: .5em; margin-bottom: 1em } .tuto_details>ugh } /* Specific items for tutorials */ .tuto_details, .tuto_exa
> { background: #f4f4f4 } .tuto_example { background: #fffff4 } .t>mple { border: 1px solid #36b; padding: .5em; margin-bottom: 1em 
>uto_type { font-weight: 700; text-align: left } /* This is a spec>} .tuto_details { background: #f4f4f4 } .tuto_example { backgroun
>ific item for the CSS tutorial: https://developer.mozilla.org/en->d: #fffff4 } .tuto_type { font-weight: 700; text-align: left } /*
>US/docs/CSS/Getting_Started/Selectors */ /* To be removed once we> This is a specific item for the CSS tutorial: https://developer.
> have Live Examples */ a.tutospecial:link, a.tutospecial:visited >mozilla.org/en-US/docs/CSS/Getting_Started/Selectors */ /* To be 
>{ padding: 1px 10px; color: #fff; background: #555; border-radius>removed once we have Live Examples */ a.tutospecial:link, a.tutos
>: 3px; border: 1px outset #333 /* fallback for next line */ ; bor>pecial:visited { padding: 1px 10px; color: #fff; background: #555
>der: 1px outset rgba(50,50,50,.5); font-family: georgia, serif; f>; border-radius: 3px; border: 1px outset #333 /* fallback for nex
>ont-size: 14px; font-style: italic; text-decoration: none; } a.tu>t line */ ; border: 1px outset rgba(50,50,50,.5); font-family: ge
>tospecial:hover, a.tutospecial:focus, a.tutospecial:active {backg>orgia, serif; font-size: 14px; font-style: italic; text-decoratio
>round-color: #666;} #tutochallenge { display:none } #tutochalleng>n: none; } a.tutospecial:hover, a.tutospecial:focus, a.tutospecia
>e a.hideAnswer { font-size: 12px; text-align:right ; display:bloc>l:active {background-color: #666;} #tutochallenge { display:none 
>k} #tutochallenge:target { display:block;} #tutochallenge + a { f>} #tutochallenge a.hideAnswer { font-size: 12px; text-align:right
>ont-size: 12px; text-align:right; display:block} #tutochallenge:t> ; display:block} #tutochallenge:target { display:block;} #tutoch
>arget + a { display:none; } /* Fix for mdn-min.css : https://deve>allenge + a { font-size: 12px; text-align:right; display:block} #
>loper.mozilla.org/media/css/mdn-min.css */ [dir="rtl"] dd { margi>tutochallenge:target + a { display:none; } /* Fix for mdn-min.css
>n: 0 22px .5em 0 } [dir="rtl"] th, [dir="rtl"] caption { text-ali> : https://developer.mozilla.org/media/css/mdn-min.css */ [dir="r
>gn: right } [dir="rtl"] .title h1 { padding: 0 18px 0 0 !importan>tl"] dd { margin: 0 22px .5em 0 } [dir="rtl"] th, [dir="rtl"] cap
>t } /* Fix for wiki-min.css : https://developer.mozilla.org/media>tion { text-align: right } [dir="rtl"] .title h1 { padding: 0 18p
>/css/wiki-min.css */ div.bug, div.warning { overflow: hidden } .p>x 0 0 !important } /* Fix for wiki-min.css : https://developer.mo
>age-content dd { margin: .5em } /* [dir="rtl"] .translate #page-b>zilla.org/media/css/wiki-min.css */ div.bug, div.warning { overfl
>uttons { } */ [dir="rtl"] .hasJS #nav-main #nav-sub-docs, [dir="r>ow: hidden } .page-content dd { margin: .5em } /* [dir="rtl"] .tr
>tl"] #nav-main .menu:hover #nav-sub-docs { margin-left: -300px } >anslate #page-buttons { } */ [dir="rtl"] .hasJS #nav-main #nav-su
>[dir="rtl"] #nav-main #nav-sub-docs li { float: right } [dir="rtl>b-docs, [dir="rtl"] #nav-main .menu:hover #nav-sub-docs { margin-
>"] #nav-main #nav-sub-docs p { text-align: left } [dir="rtl"] .pa>left: -300px } [dir="rtl"] #nav-main #nav-sub-docs li { float: ri
>ge-content ul { padding-left: 0; padding-right: 22px } [dir="rtl">ght } [dir="rtl"] #nav-main #nav-sub-docs p { text-align: left } 
>] .page-content dd { padding-left: 0; padding-right: 15px } [dir=>[dir="rtl"] .page-content ul { padding-left: 0; padding-right: 22
>"rtl"] .article a.external, [dir="rtl"] .article a[rel~="external>px } [dir="rtl"] .page-content dd { padding-left: 0; padding-righ
>"], [dir="rtl"] .article a[href^="news://"] { padding-right: 0; b>t: 15px } [dir="rtl"] .article a.external, [dir="rtl"] .article a
>ackground-position: 1% 40% } [dir="rtl"] .article a.external, [di>[rel~="external"], [dir="rtl"] .article a[href^="news://"] { padd
>r="rtl"] .article a[rel~="external"] { padding-left: 16px } [dir=>ing-right: 0; background-position: 1% 40% } [dir="rtl"] .article 
>"rtl"] .article a[href^="news://"] { padding-left: 18px } /* for >a.external, [dir="rtl"] .article a[rel~="external"] { padding-lef
>B2G docs, to allow use of B2G lookalike UX elements */ /* For dis>t: 16px } [dir="rtl"] .article a[href^="news://"] { padding-left:
>play of Firefox OS UX screenshots in a grid */ table.fxosScreenGr> 18px } /* for B2G docs, to allow use of B2G lookalike UX element
>id, table.fxosScreenGrid tr { border: none; } table.fxosScreenGri>s */ /* For display of Firefox OS UX screenshots in a grid */ tab
>d td, table.fxosScreenGrid th { border: none; width: 340px; verti>le.fxosScreenGrid, table.fxosScreenGrid tr { border: none; } tabl
>cal-align: top } div.fxosLiveSampleWrapper { width: 328px; paddin>e.fxosScreenGrid td, table.fxosScreenGrid th { border: none; widt
>g: 6px 4px; text-align: center; border: 1px solid #B8B2A4; backgr>h: 340px; vertical-align: top } div.fxosLiveSampleWrapper { width
>ound-color: #F3ECDD; } .rightButtonBox { float: right; width: 250>: 328px; padding: 6px 4px; text-align: center; border: 1px solid 
>px; position: relative; z-index: 2; } [dir="rtl"] .rightButtonBox>#B8B2A4; background-color: #F3ECDD; } .rightButtonBox { float: ri
> { margin: 0 15px 15px 0; float: left } /* ---------------------->ght; width: 250px; position: relative; z-index: 2; } [dir="rtl"] 
>------------ * Buttons * ---------------------------------- */ .b>.rightButtonBox { margin: 0 15px 15px 0; float: left } /* -------
>2g-button::-moz-focus-inner { border: none; outline: none; } .b2g>--------------------------- * Buttons * -------------------------
>-button { width: 100%; height: 3.8rem; margin: 0 0 1rem; padding:>--------- */ .b2g-button::-moz-focus-inner { border: none; outlin
> 0 1.5rem; -moz-box-sizing: border-box; display: inline-block; ve>e: none; } .b2g-button { width: 100%; height: 3.8rem; margin: 0 0
>rtical-align: middle; text-overflow: ellipsis; white-space: nowra> 1rem; padding: 0 1.5rem; -moz-box-sizing: border-box; display: i
>p; overflow: hidden; background: #fafafa url(https://developer.mo>nline-block; vertical-align: middle; text-overflow: ellipsis; whi
>zilla.org/media/gaia/shared/style/buttons/images/ui/default.png) >te-space: nowrap; overflow: hidden; background: #fafafa url(https
>repeat-x left bottom; border: .1rem solid #a6a6a6; border-radius:>://developer.mozilla.org/media/gaia/shared/style/buttons/images/u
> .2rem; font: 500 1.6rem/3.8rem 'MozTT', Sans-serif; color: #333;>i/default.png) repeat-x left bottom; border: .1rem solid #a6a6a6;
> text-align: center; text-shadow: .1rem .1rem 0 rgba(255, 255, 25> border-radius: .2rem; font: 500 1.6rem/3.8rem 'MozTT', Sans-seri
>5, .3); text-decoration: none; outline: none; } /* Press (default>f; color: #333; text-align: center; text-shadow: .1rem .1rem 0 rg
> & recommend) */ .b2g-button:active, .b2g-button.recommend:ac>ba(255, 255, 255, .3); text-decoration: none; outline: none; } /*
>tive, .b2g-button:hover, .b2g-button.recommend:hover { border-col> Press (default & recommend) */ .b2g-button:active, .b2g-butt
>or: #008aaa; background: #008aaa; text-decoration: none; color: #>on.recommend:active, .b2g-button:hover, .b2g-button.recommend:hov
>333; } /* For styling bug links */ .bug-resolved { text-decoratio>er { border-color: #008aaa; background: #008aaa; text-decoration:
>n: line-through; } /* Bages for the Spec2 template */ .spec-ED:be> none; color: #333; } /* For styling bug links */ .bug-resolved {
>fore, .spec-WD:before, .spec-CR:before, .spec-PR:before, .spec-RE> text-decoration: line-through; } /* Bages for the Spec2 template
>C:before, .spec-RFC:before, .spec-Living:before, .spec-Standard:b> */ .spec-ED:before, .spec-WD:before, .spec-CR:before, .spec-PR:b
>efore, .spec-Draft:before { display: inline-block; font: .6em Hel>efore, .spec-REC:before, .spec-RFC:before, .spec-Living:before, .
>vetica,Arial,sans-serif; margin: 0 .6em 0 0; padding: .55em .45em>spec-Standard:before, .spec-Draft:before { display: inline-block;
> .45em; vertical-align: top; } .redesign .spec-ED:before, .redesi> font: .6em Helvetica,Arial,sans-serif; margin: 0 .6em 0 0; paddi
>gn .spec-WD:before, .redesign .spec-CR:before, .redesign .spec-PR>ng: .55em .45em .45em; vertical-align: top; } .redesign .spec-ED:
>:before, .redesign .spec-REC:before, .redesign .spec-RFC:before, >before, .redesign .spec-WD:before, .redesign .spec-CR:before, .re
>.redesign .spec-Living:before, .redesign .spec-Standard:before, .>design .spec-PR:before, .redesign .spec-REC:before, .redesign .sp
>redesign .spec-Draft:before { font:.7em Helvetica,Arial,sans-seri>ec-RFC:before, .redesign .spec-Living:before, .redesign .spec-Sta
>f; font-weight:700; min-width:20px; border-radius:2px; letter-spa>ndard:before, .redesign .spec-Draft:before { font:.7em Helvetica,
>cing:1px; margin:.2em .6em 0 0; padding:.45em .35em .35em; color:>Arial,sans-serif; font-weight:700; min-width:20px; border-radius:
> inherit; } .spec-ED:before, .spec-WD:before, .spec-CR:before, .s>2px; letter-spacing:1px; margin:.2em .6em 0 0; padding:.45em .35e
>pec-PR:before, .spec-REC:before, .spec-RFC:before, .spec-Living:b>m .35em; color: inherit; } .spec-ED:before, .spec-WD:before, .spe
>efore, .spec-Standard:before, .spec-Draft:before { color: white; >c-CR:before, .spec-PR:before, .spec-REC:before, .spec-RFC:before,
>} .spec-ED:before { content: 'ED'; background-color: #e61919 } .r> .spec-Living:before, .spec-Standard:before, .spec-Draft:before {
>edesign .spec-ED:before { background-color:rgba(230,25,25,0.25); > color: white; } .spec-ED:before { content: 'ED'; background-colo
>border-left:4px solid rgba(230,25,25,1); color:rgba(230,25,25,1);>r: #e61919 } .redesign .spec-ED:before { background-color:rgba(23
> } .spec-WD:before { content: 'WD'; background-color: #E66E33 } .>0,25,25,0.25); border-left:4px solid rgba(230,25,25,1); color:rgb
>redesign .spec-WD:before { background-color:rgba(230,110,51,0.25)>a(230,25,25,1); } .spec-WD:before { content: 'WD'; background-col
>; border-left:4px solid rgba(230,110,51,1); color:rgba(230,110,51>or: #E66E33 } .redesign .spec-WD:before { background-color:rgba(2
>,1); } .spec-CR:before { content: 'CR'; background-color: #CFD510>30,110,51,0.25); border-left:4px solid rgba(230,110,51,1); color:
> } .redesign .spec-CR:before { background-color:rgba(0,151,142,0.>rgba(230,110,51,1); } .spec-CR:before { content: 'CR'; background
>25); border-left:4px solid rgba(0,151,142,1); color:rgba(0,151,14>-color: #CFD510 } .redesign .spec-CR:before { background-color:rg
>2,1); } .spec-PR:before { content: 'PR'; background-color: #72AC3>ba(0,151,142,0.25); border-left:4px solid rgba(0,151,142,1); colo
>5 } .redesign .spec-PR:before { background-color:rgba(114,172,53,>r:rgba(0,151,142,1); } .spec-PR:before { content: 'PR'; backgroun
>0.25); border-left:4px solid rgba(114,172,53,1); color:rgba(114,1>d-color: #72AC35 } .redesign .spec-PR:before { background-color:r
>72,53,1); } .spec-REC:before { content: 'REC'; background-color: >gba(114,172,53,0.25); border-left:4px solid rgba(114,172,53,1); c
>#309C40 } .redesign .spec-REC:before { background-color:rgba(48,1>olor:rgba(114,172,53,1); } .spec-REC:before { content: 'REC'; bac
>56,64,0.25); border-left:4px solid rgba(48,156,64,1); color:rgba(>kground-color: #309C40 } .redesign .spec-REC:before { background-
>48,156,64,1); } .spec-Living:before { content: 'LS'; background-c>color:rgba(48,156,64,0.25); border-left:4px solid rgba(48,156,64,
>olor: #000 } .redesign .spec-Living:before { background-color:rgb>1); color:rgba(48,156,64,1); } .spec-Living:before { content: 'LS
>a(0,83,159,0.25); border-left:4px solid rgba(0,83,159,1); color:r>'; background-color: #000 } .redesign .spec-Living:before { backg
>gba(0,83,159,1); } .spec-RFC:before { content: 'RFC'; background->round-color:rgba(0,83,159,0.25); border-left:4px solid rgba(0,83,
>color: #000 } .redesign .spec-RFC:before { background-color:rgba(>159,1); color:rgba(0,83,159,1); } .spec-RFC:before { content: 'RF
>0,83,159,0.25); border-left:4px solid rgba(0,83,159,1); color:rgb>C'; background-color: #000 } .redesign .spec-RFC:before { backgro
>a(0,83,159,1); } .spec-Standard:before { content: 'ST'; backgroun>und-color:rgba(0,83,159,0.25); border-left:4px solid rgba(0,83,15
>d-color: #000 } .redesign .spec-Standard:before { background-colo>9,1); color:rgba(0,83,159,1); } .spec-Standard:before { content: 
>r:rgba(0,83,159,0.25); border-left:4px solid rgba(0,83,159,1); co>'ST'; background-color: #000 } .redesign .spec-Standard:before { 
>lor:rgba(0,83,159,1); } .spec-Draft:before { content: 'D'; backgr>background-color:rgba(0,83,159,0.25); border-left:4px solid rgba(
>ound-color: #E66E33 } .redesign .spec-Draft:before { background-c>0,83,159,1); color:rgba(0,83,159,1); } .spec-Draft:before { conte
>olor:rgba(230,110,51,0.25); border-left:4px solid rgba(230,110,51>nt: 'D'; background-color: #E66E33 } .redesign .spec-Draft:before
>,1); color:rgba(230,110,51,1); } .redesign .spec-ED { color:rgba(> { background-color:rgba(230,110,51,0.25); border-left:4px solid 
>230,25,25,1); } .redesign .spec-WD { color:rgba(230,110,51,1); } >rgba(230,110,51,1); color:rgba(230,110,51,1); } .redesign .spec-E
>.redesign .spec-CR { color:rgba(0,151,142,1); } .redesign .spec-P>D { color:rgba(230,25,25,1); } .redesign .spec-WD { color:rgba(23
>R { color:rgba(114,172,53,1); } .redesign .spec-REC { color:rgba(>0,110,51,1); } .redesign .spec-CR { color:rgba(0,151,142,1); } .r
>48,156,64,1); } .redesign .spec-RFC { color:rgba(48,156,64,1); } >edesign .spec-PR { color:rgba(114,172,53,1); } .redesign .spec-RE
>.redesign .spec-Living { color:rgba(0,83,159,1); } .redesign .spe>C { color:rgba(48,156,64,1); } .redesign .spec-RFC { color:rgba(4
>c-Standard { color:rgba(0,83,159,1); } .redesign .spec-Draft { co>8,156,64,1); } .redesign .spec-Living { color:rgba(0,83,159,1); }
>lor:rgba(230,110,51,1); } /* Template link style */ .templateLink> .redesign .spec-Standard { color:rgba(0,83,159,1); } .redesign .
> { border: 1px solid #ccc; padding: 1px; } /* * Colorized icons *>spec-Draft { color:rgba(230,110,51,1); } /* Template link style *
>/ #wikiArticle i.icon-beaker, #wikiArticle i.icon-warning-sign, #>/ .templateLink { border: 1px solid #ccc; padding: 1px; } /* * Co
>wikiArticle i.icon-thumbs-down-alt, #wikiArticle i.icon-stethosco>lorized icons */ #wikiArticle i.icon-beaker, #wikiArticle i.icon-
>pe, #wikiArticle i.icon-trash { cursor: default } #wikiArticle i.>warning-sign, #wikiArticle i.icon-thumbs-down-alt, #wikiArticle i
>icon-beaker { color: #09d } /* experimental */ #wikiArticle i.ico>.icon-stethoscope, #wikiArticle i.icon-trash { cursor: default } 
>n-warning-sign { color: #db0 } /* non-standard */ #wikiArticle i.>#wikiArticle i.icon-beaker { color: #09d } /* experimental */ #wi
>icon-thumbs-down-alt { color: #000 } /* deprecated */ #wikiArticl>kiArticle i.icon-warning-sign { color: #db0 } /* non-standard */ 
>e i.icon-trash { color: #d00 } /* obsolete */ #wikiArticle i.icon>#wikiArticle i.icon-thumbs-down-alt { color: #000 } /* deprecated
>-stethoscope { color: darkslateblue } /* unimplemented */ /* * La> */ #wikiArticle i.icon-trash { color: #d00 } /* obsolete */ #wik
>nding page lists */ dt.landingPageList, dd.landingPageList { page>iArticle i.icon-stethoscope { color: darkslateblue } /* unimpleme
>-break-after: avoid } /* * "Mozilla only" banners */ .bannerWrapp>nted */ /* * Landing page lists */ dt.landingPageList, dd.landing
>er { overflow: hidden; padding-right: 2px; } .mozOnlyBanner { bac>PageList { page-break-after: avoid } /* * "Mozilla only" banners 
>kground-color: #C33B1D; background-image: url("https://developer.>*/ .bannerWrapper { overflow: hidden; padding-right: 2px; } .mozO
>mozilla.org/files/5429/firefox.png"), radial-gradient(circle 16px>nlyBanner { background-color: #C33B1D; background-image: url("htt
> at 18px 18px, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.5) 11px, rgba(0,0>ps://developer.mozilla.org/files/5429/firefox.png"), radial-gradi
>,0,0) 18px), linear-gradient(to right, #C33B1D 40%, #DDA820); bac>ent(circle 16px at 18px 18px, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.5)
>kground-repeat: no-repeat; background-size: contain; border-top-l> 11px, rgba(0,0,0,0) 18px), linear-gradient(to right, #C33B1D 40%
>eft-radius: 18px; border-bottom-left-radius: 18px; border-top-rig>, #DDA820); background-repeat: no-repeat; background-size: contai
>ht-radius: 6px; border-bottom-right-radius: 6px; height: 36px; ov>n; border-top-left-radius: 18px; border-bottom-left-radius: 18px;
>erflow: hidden; color: white; box-shadow: 0 0 3px #111; font-fami> border-top-right-radius: 6px; border-bottom-right-radius: 6px; h
>ly: "Lucida Grande","Lucida Sans Unicode","DejaVu Sans",Lucida,Ar>eight: 36px; overflow: hidden; color: white; box-shadow: 0 0 3px 
>ial,Helvetica,sans-serif; } .mozOnlyBanner dt { font-weight: bold>#111; font-family: "Lucida Grande","Lucida Sans Unicode","DejaVu 
>; font-size: 16px; text-shadow: 1px 1px 0 #222; padding-left: 42p>Sans",Lucida,Arial,Helvetica,sans-serif; } .mozOnlyBanner dt { fo
>x; margin-left: 0px; margin-bottom: 0px; padding-bottom: 0px; } .>nt-weight: bold; font-size: 16px; text-shadow: 1px 1px 0 #222; pa
>mozOnlyBanner dd { font-size: 11px; text-shadow: 1px 1px 0 #222; >dding-left: 42px; margin-left: 0px; margin-bottom: 0px; padding-b
>padding-left: 42px; margin-left: 0px; margin-top: 0px; padding-to>ottom: 0px; } .mozOnlyBanner dd { font-size: 11px; text-shadow: 1
>p: 0px; } /* 一時的なスタイル */ [lang="ja"] #doc-contributors time[datet>px 1px 0 #222; padding-left: 42px; margin-left: 0px; margin-top: 
>ime*="200"]::after { content: " (※最終更新日から 2 年以上経過しています)"; color: >0px; padding-top: 0px; } /* 一時的なスタイル */ [lang="ja"] #doc-contribu
>red } /* redesign htabs */ .redesign .htab>ul>li { height: >tors time[datetime*="200"]::after { content: " (※最終更新日から 2 年以上経過し
>32px; border:1px solid rgba(212,221,228,0); border-radius: 0; fon>ています)"; color: red } /* redesign htabs */ .redesign .htab>ul&g
>t-size:14px; font-weight:200; font-family:'Open Sans Light',sans->t;li { height: 32px; border:1px solid rgba(212,221,228,0); border
>serif; background-color:#f1f6f8!important; color:rgba(77,78,83,1)>-radius: 0; font-size:14px; font-weight:200; font-family:'Open Sa
>; opacity:.75; -ms-filter:progid:DXImageTransform.Microsoft.Alpha>ns Light',sans-serif; background-color:#f1f6f8!important; color:r
>(Opacity=75); filter:progid:DXImageTransform.Microsoft.Alpha(Opac>gba(77,78,83,1); opacity:.75; -ms-filter:progid:DXImageTransform.
>ity=75); } .redesign .htab>ul>li.selected { border:0 solid >Microsoft.Alpha(Opacity=75); filter:progid:DXImageTransform.Micro
>rgba(212,221,228,0.25); border-top:2px solid rgba(212,221,228,1);>soft.Alpha(Opacity=75); } .redesign .htab>ul>li.selected { 
> padding-top: 4px; background-color:rgba(234,239,242,1)!important>border:0 solid rgba(212,221,228,0.25); border-top:2px solid rgba(
>; } .redesign .htab>div { background-color:rgba(234,239,242,1)>212,221,228,1); padding-top: 4px; background-color:rgba(234,239,2
>; border:0 solid rgba(212,221,228,0.25); } .redesign .htab > u>42,1)!important; } .redesign .htab>div { background-color:rgba
>l > li > a { text-decoration: none; padding:2px 18px 4px; }>(234,239,242,1); border:0 solid rgba(212,221,228,0.25); } .redesi
> .redesign .htab > ul > li > a:hover, .redesign .htab &g>gn .htab > ul > li > a { text-decoration: none; padding:
>t; ul > li > a:focus { text-decoration: underline; } /* new>2px 18px 4px; } .redesign .htab > ul > li > a:hover, .re
> modules */ .summary-box-events { display:table; background-color>design .htab > ul > li > a:focus { text-decoration: unde
>:rgba(0,150,221,0.1); padding:11px 22px; } .redesign[dir="ltr"] .>rline; } /* new modules */ .summary-box-events { display:table; b
>summary-box-events { clear:left; border-left:6px solid rgba(0,150>ackground-color:rgba(0,150,221,0.1); padding:11px 22px; } .redesi
>,221,0.5); } .redesign[dir="rtl"] .summary-box-events { clear:rig>gn[dir="ltr"] .summary-box-events { clear:left; border-left:6px s
>ht; border-right:6px solid rgba(0,150,221,0.5); } .summary-box-js>olid rgba(0,150,221,0.5); } .redesign[dir="rtl"] .summary-box-eve
> { display:table; background-color:rgba(230,96,0,0.1); padding: 1>nts { clear:right; border-right:6px solid rgba(0,150,221,0.5); } 
>1px 22px; } .redesign[dir="ltr"] .summary-box-js { clear:left; bo>.summary-box-js { display:table; background-color:rgba(230,96,0,0
>rder-left:6px solid rgba(230,96,0,0.5); } .redesign[dir="rtl"] .s>.1); padding: 11px 22px; } .redesign[dir="ltr"] .summary-box-js {
>ummary-box-js { clear:right; border-right:6px solid rgba(230,96,0> clear:left; border-left:6px solid rgba(230,96,0,0.5); } .redesig
>,0.5); } .redesign .standardNote, .redesign .optional,.renamed { >n[dir="rtl"] .summary-box-js { clear:right; border-right:6px soli
>background:rgba(0,83,159,0.2); border-color:rgba(0,0,0,0.05); } .>d rgba(230,96,0,0.5); } .redesign .standardNote, .redesign .optio
>redesign .obsolete, .redesign .notXPCOM { background:rgba(230,96,>nal,.renamed { background:rgba(0,83,159,0.2); border-color:rgba(0
>0,0.45); border-color:rgba(0,0,0,0.05); } /* sidebar quick links >,0,0,0.05); } .redesign .obsolete, .redesign .notXPCOM { backgrou
>stuff */ .quick-links .sidebar-icon i[class^="icon-"] { top: 10px>nd:rgba(230,96,0,0.45); border-color:rgba(0,0,0,0.05); } /* sideb
>; position: absolute; left: 12px; display: block; opacity: 0.3; }>ar quick links stuff */ .quick-links .sidebar-icon i[class^="icon
> /* new community box */ .communitybox { background-color: rgba(0>-"] { top: 10px; position: absolute; left: 12px; display: block; 
>,83,159,1); background-image: url("/media/redesign/img/blueprint.>opacity: 0.3; } /* new community box */ .communitybox { backgroun
>png"); } .communitybox, .communitybox a, .communitybox a:hover, .>d-color: rgba(0,83,159,1); background-image: url("/media/redesign
>communitybox a:focus, .communitybox a:visited { color: #fff; } .c>/img/blueprint.png"); } .communitybox, .communitybox a, .communit
>ommunitybox .communitysubhead { font-size: 16px; font-weight: bol>ybox a:hover, .communitybox a:focus, .communitybox a:visited { co
>d; margin-top: 11px; padding-bottom: 6px; } .communitybox ul { pa>lor: #fff; } .communitybox .communitysubhead { font-size: 16px; f
>dding-left: 0; margin-bottom:0; list-style-type: none; } .communi>ont-weight: bold; margin-top: 11px; padding-bottom: 6px; } .commu
>tybox ul.communitymailinglist li { display: inline-block; margin->nitybox ul { padding-left: 0; margin-bottom:0; list-style-type: n
>right: 4px; margin-top: 6px} .communitybox ul.communitymailinglis>one; } .communitybox ul.communitymailinglist li { display: inline
>t a { background: rgba(255, 255, 255, 0.3); display: inline-block>-block; margin-right: 4px; margin-top: 6px} .communitybox ul.comm
>; color: #fff; padding: 3px 6px; border-radius: 3px; } .community>unitymailinglist a { background: rgba(255, 255, 255, 0.3); displa
>box .communitycontact { font-size: 14px; margin-top: 13px;} .comm>y: inline-block; color: #fff; padding: 3px 6px; border-radius: 3p
>unitybox .communitycontact a { border-bottom: 1px solid rgba(255,>x; } .communitybox .communitycontact { font-size: 14px; margin-to
> 255, 255, 0.6); } .communitybox .communitycontact a:hover, .comm>p: 13px;} .communitybox .communitycontact a { border-bottom: 1px 
>unitybox .communitycontact a:focus { text-decoration:none; border>solid rgba(255, 255, 255, 0.6); } .communitybox .communitycontact
>-bottom: 1px solid rgba(255, 255, 255, 0.9); } .communitybox stro> a:hover, .communitybox .communitycontact a:focus { text-decorati
>ng { font-size: 15px; font-weight: bold; } /* Default glossary li>on:none; border-bottom: 1px solid rgba(255, 255, 255, 0.9); } .co
>nks style to ease readability */ a.glossaryLink:link, a.glossaryL>mmunitybox strong { font-size: 15px; font-weight: bold; } /* Defa
>ink:hover, a.glossaryLink:visited, a.glossaryLink:focus, a.glossa>ult glossary links style to ease readability */ a.glossaryLink:li
>ryLink:active{ color:inherit; text-decoration: none; border-botto>nk, a.glossaryLink:hover, a.glossaryLink:visited, a.glossaryLink:
>m: 1px dashed #AAA; cursor:help; } a.new.glossaryLink:link, a.new>focus, a.glossaryLink:active{ color:inherit; text-decoration: non
>.glossaryLink:hover, a.new.glossaryLink:visited, a.new.glossaryLi>e; border-bottom: 1px dashed #AAA; cursor:help; } a.new.glossaryL
>nk:focus, a.new.glossaryLink:active{ color:#900; border-bottom: n>ink:link, a.new.glossaryLink:hover, a.new.glossaryLink:visited, a
>one; } a.new.glossaryLink:hover { text-decoration: underline; } />.new.glossaryLink:focus, a.new.glossaryLink:active{ color:#900; b
>* download buttons */ a.download-button { margin-bottom: 20px; pa>order-bottom: none; } a.new.glossaryLink:hover { text-decoration:
>dding: 10px; text-align: center; border-radius: 4px; display: inl> underline; } /* download buttons */ a.download-button { margin-b
>ine-block; background-color: #81BC2E; white-space: nowrap; color:>ottom: 20px; padding: 10px; text-align: center; border-radius: 4p
> #FFF; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25); box-shadow: >x; display: inline-block; background-color: #81BC2E; white-space:
>0px 1px 0px 0px rgba(0, 0, 0, 0.2), 0px -1px 0px 0px rgba(0, 0, 0> nowrap; color: #FFF; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25
>, 0.3) inset; } a.download-button:hover { color: rgb(200,200,200)>); box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.2), 0px -1px 0px 0
>; } a.download-button:visited { color:white; } a.download-button:>px rgba(0, 0, 0, 0.3) inset; } a.download-button:hover { color: r
>link { color:white; } a.download-button .right-align { float: rig>gb(200,200,200); } a.download-button:visited { color:white; } a.d
>ht; } /* download box stuff */ li.download-box { text-align:cente>ownload-button:link { color:white; } a.download-button .right-ali
>r; vertical-align:middle; } li.download-box img { float:none; }>gn { float: right; } /* download box stuff */ li.download-box { t
 >ext-align:center; vertical-align:middle; } li.download-box img { 
 >float:none; }

Back to History