Compare Revisions

Template:CustomCSS

Change Revisions

Revision 506477:

Revision 506477 by openjck on

Revision 506481:

Revision 506481 by openjck on

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

Revision 506477
Revision 506481
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 -- */
> /* Make the 2nd breadcrumbs disappear, only if the page has been> /* Make the 2nd breadcrumbs disappear, only if the page has been
> regenerated with a modern template */ .column-container #wikiArt> regenerated with a modern template */ .column-container #wikiArt
>icle .themeUpdated { display:none } /* Used to wrap columns that >icle .themeUpdated { display:none } /* Used to wrap columns that 
>should all be the same height */ .equalColumnHeights { display: t>should all be the same height */ .equalColumnHeights { display: t
>able; border-collapse: separate; border-spacing: 20px; } .equalCo>able; border-collapse: separate; border-spacing: 20px; } .equalCo
>lumnHeights div { display: table-cell; width: 50%; height:100%; }>lumnHeights div { display: table-cell; width: 50%; height:100%; }
> /* highlighted (bottom) link in call-out boxes */ .callout-link-> /* highlighted (bottom) link in call-out boxes */ .callout-link-
>container { position:relative; height:100%; } .callout-link-wrapp>container { position:relative; height:100%; } .callout-link-wrapp
>er { padding-top:32px; } .callout-link { font-style: italic; font>er { padding-top:32px; } .callout-link { font-style: italic; font
>-size: 14px; font-weight: normal; display:block; position:absolut>-size: 14px; font-weight: normal; display:block; position:absolut
>e; bottom:0; right:0; } /* Make the Quick Links be hidden in the >e; bottom:0; right:0; } /* Make the Quick Links be hidden in the 
>old theme */ html:not(.redesign) #Quick_Links { display:none} htm>old theme */ html:not(.redesign) #Quick_Links { display:none} htm
>l:not(.redesign) h2#Quick_Links + ol { display:none} /* remove le>l:not(.redesign) h2#Quick_Links + ol { display:none} /* remove le
>ft margin from Font Awesome icons inside wiki content; this is me>ft margin from Font Awesome icons inside wiki content; this is me
>ssing up document content */ #wikiArticle i[class^="icon-"] { mar>ssing up document content */ #wikiArticle i[class^="icon-"] { mar
>gin-left: 0px; } /* Iframe for live sample centered (Test) */ .ce>gin-left: 0px; } /* Iframe for live sample centered (Test) */ .ce
>ntered iframe { display: block; margin: 0 auto;border:none } /* S>ntered iframe { display: block; margin: 0 auto;border:none } /* S
>imulate two columns for landing page, if enough space is availabl>imulate two columns for landing page, if enough space is availabl
>e */ @media (min-width:1050px) { .topicpage-table {display: table>e */ @media (min-width:1050px) { .topicpage-table {display: table
>; border-collapse: separate; border-spacing: 20px 0 } /* Next lin>; border-collapse: separate; border-spacing: 20px 0 } /* Next lin
>e to remove once the redesign is live: */ .topicpage-table .secti>e to remove once the redesign is live: */ .topicpage-table .secti
>on:first-of-type { margin-right: 20px; border-right: solid 1px li>on:first-of-type { margin-right: 20px; border-right: solid 1px li
>ghtgrey; } .redesign .topicpage-table .section:first-of-type { bo>ghtgrey; } .redesign .topicpage-table .section:first-of-type { bo
>rder-right:solid 6px rgba(212,221,228,0.5); } html[dir="rtl"] .re>rder-right:solid 6px rgba(212,221,228,0.5); } html[dir="rtl"] .re
>design .topicpage-table .section:first-of-type { border-left:soli>design .topicpage-table .section:first-of-type { border-left:soli
>d 6px rgba(212,221,228,0.5); border-right: none; } .landing { dis>d 6px rgba(212,221,228,0.5); border-right: none; } .landing { dis
>play: table-row;} .section { display: table-cell; width:50%;} } />play: table-row;} .section { display: table-cell; width:50%;} } /
>* For Landing page boxes; these are boxes displayed within column>* For Landing page boxes; these are boxes displayed within column
>s on landing pages, such as the Community and Related boxes. */ .>s on landing pages, such as the Community and Related boxes. */ .
>landingPageBox { width: 100%; padding: 0px; border-bottom: 1px so>landingPageBox { width: 100%; padding: 0px; border-bottom: 1px so
>lid #bbb; margin-bottom: 3px; } .landingPageBox ul { padding-left>lid #bbb; margin-bottom: 3px; } .landingPageBox ul { padding-left
>: 44px; } /* Wide column box */ .wideColumnBox { column-width:375>: 44px; } /* Wide column box */ .wideColumnBox { column-width:375
>px; -moz-column-width:375px; -webkit-column-width:375px; -o-colum>px; -moz-column-width:375px; -webkit-column-width:375px; -o-colum
>n-width:375px; -ms-column-width:375px;} .wideColumnBoxList li { l>n-width:375px; -ms-column-width:375px;} .wideColumnBoxList li { l
>ine-height: 1.5; list-style-type: none; padding-left: 0; page-bre>ine-height: 1.5; list-style-type: none; padding-left: 0; page-bre
>ak-inside: avoid; } /* Multi-column boxes for lists of longer lin>ak-inside: avoid; } /* Multi-column boxes for lists of longer lin
>ks; this will adapt based on screen width */ .multiColumnList { c>ks; this will adapt based on screen width */ .multiColumnList { c
>olumn-width:250px; -moz-column-width:250px; -webkit-column-width:>olumn-width:250px; -moz-column-width:250px; -webkit-column-width:
>250px; -o-column-width:250px; -ms-column-width:250px;} .multiColu>250px; -o-column-width:250px; -ms-column-width:250px;} .multiColu
>mnList li { line-height: 1.5; list-style-type: none; padding-left>mnList li { line-height: 1.5; list-style-type: none; padding-left
>: 0; page-break-inside: avoid; } /* Multi-column boxes for smalle>: 0; page-break-inside: avoid; } /* Multi-column boxes for smalle
>r links, such as API terms */ .smallMultiColumnList { column-widt>r links, such as API terms */ .smallMultiColumnList { column-widt
>h: 120px; -moz-column-width:120px; -webkit-column-width:120px; -o>h: 120px; -moz-column-width:120px; -webkit-column-width:120px; -o
>-column-width:120px; -ms-column-width:120px} .smallMultiColumnLis>-column-width:120px; -ms-column-width:120px} .smallMultiColumnLis
>t li { list-style-type: none; padding-left: 0; page-break-inside:>t li { list-style-type: none; padding-left: 0; page-break-inside:
> avoid; } /* Multi-column box for smaller text */ .horizFlexboxCo> avoid; } /* Multi-column box for smaller text */ .horizFlexboxCo
>ntainer { display: flex; display: -webkit-flex; flex-flow: column>ntainer { display: flex; display: -webkit-flex; flex-flow: column
> nowrap; -webkit-flex-flow: column nowrap; justify-content: cente> nowrap; -webkit-flex-flow: column nowrap; justify-content: cente
>r; -webkit-justify-content: center; align-content: center; -webki>r; -webkit-justify-content: center; align-content: center; -webki
>t-align-content: center; align-items: center; -webkit-align-items>t-align-content: center; align-items: center; -webkit-align-items
>: center; flex-direction: column; -webkit-flex-direction: column;>: center; flex-direction: column; -webkit-flex-direction: column;
> } div.smallTextMultiColumnBoxHeading { background-color: #aac; b> } div.smallTextMultiColumnBoxHeading { background-color: #aac; b
>order-radius: 10px 10px 0 0; border: 2px solid #ccc; order: 1; -w>order-radius: 10px 10px 0 0; border: 2px solid #ccc; order: 1; -w
>ebkit-order: 1; width: 75%; padding: 10px; flex: 0 1 auto; -webki>ebkit-order: 1; width: 75%; padding: 10px; flex: 0 1 auto; -webki
>t-flex: 0 1 auto; font-weight: bold; } div.smallTextMultiColumnBo>t-flex: 0 1 auto; font-weight: bold; } div.smallTextMultiColumnBo
>xList { border: 2px solid #ccc; background-color: #ddf; border-to>xList { border: 2px solid #ccc; background-color: #ddf; border-to
>p: 0; border-radius: 0 0 10px 10px; width: 75%; padding: 10px; or>p: 0; border-radius: 0 0 10px 10px; width: 75%; padding: 10px; or
>der: 2; -webkit-order: 2; flex: 0 1 auto; -webkit-flex: 0 1 auto;>der: 2; -webkit-order: 2; flex: 0 1 auto; -webkit-flex: 0 1 auto;
> } div.smallTextMultiColumnBoxList ul { column-width:100px; -moz-> } div.smallTextMultiColumnBoxList ul { column-width:100px; -moz-
>column-width:100px; -webkit-column-width:100px; -o-column-width:1>column-width:100px; -webkit-column-width:100px; -o-column-width:1
>00px; -ms-column-width:100px; } div.smallTextMultiColumnBoxList l>00px; -ms-column-width:100px; } div.smallTextMultiColumnBoxList l
>i { list-style-type: none; padding-left: 0; font-size: 80%; } /* >i { list-style-type: none; padding-left: 0; font-size: 80%; } /* 
>For ending "text alongside images" blocks; add this class to the >For ending "text alongside images" blocks; add this class to the 
>first block that shouldn't be next to the image */ .endImageWrapp>first block that shouldn't be next to the image */ .endImageWrapp
>ing { clear: both; } /* Fancy Table of content for main pages of >ing { clear: both; } /* Fancy Table of content for main pages of 
>tutorial*/ .fancyTOC { counter-reset: fancyTOC; -moz-columns: 18e>tutorial*/ .fancyTOC { counter-reset: fancyTOC; -moz-columns: 18e
>m; columns: 18em; margin-bottom: 1em } .fancyTOC .button { displa>m; columns: 18em; margin-bottom: 1em } .fancyTOC .button { displa
>y: block; margin-right: 0; margin-bottom: .25em; background-color>y: block; margin-right: 0; margin-bottom: .25em; background-color
>: #A24C4C; color: #fff; font-size: 1.5em; line-height: 1.5 } .fan>: #A24C4C; color: #fff; font-size: 1.5em; line-height: 1.5 } .fan
>cyTOC a::before { counter-increment: fancyTOC; content: counter(f>cyTOC a::before { counter-increment: fancyTOC; content: counter(f
>ancyTOC) ". " } .fancyTOC a::after { content: ' »' } .fancyTOC .b>ancyTOC) ". " } .fancyTOC a::after { content: ' »' } .fancyTOC .b
>utton:hover, .fancyTOC .button:focus, .fancyTOC .button:active { >utton:hover, .fancyTOC .button:focus, .fancyTOC .button:active { 
>background-color: #C26C6C } /* In index, dim obsolete, deprecated>background-color: #C26C6C } /* In index, dim obsolete, deprecated
> or non-standard element instead of striking through them */ s.de> or non-standard element instead of striking through them */ s.de
>precatedElement, s.obsoleteElement, s.nonStdElement { text-decora>precatedElement, s.obsoleteElement, s.nonStdElement { text-decora
>tion: none; opacity: .3 } /* Add widgeted index, here adding an H>tion: none; opacity: .3 } /* Add widgeted index, here adding an H
>TML5 badge as the bullet of the li element if class="html5" */ di>TML5 badge as the bullet of the li element if class="html5" */ di
>v.index.widgeted { -webkit-column-width: 10em; -moz-column-width:>v.index.widgeted { -webkit-column-width: 10em; -moz-column-width:
> 10em; columns: 10em } div.index.widgeted li { padding-left: 18px> 10em; columns: 10em } div.index.widgeted li { padding-left: 18px
> } div.index.widgeted li.html5 { background-image: url("/files/38> } div.index.widgeted li.html5 { background-image: url("/files/38
>55/HTML5_Badge_16.png"); background-repeat: no-repeat; background>55/HTML5_Badge_16.png"); background-repeat: no-repeat; background
>-position: left 4px } [dir="rtl"] div.index.widgeted li { padding>-position: left 4px } [dir="rtl"] div.index.widgeted li { padding
>-right: 18px } [dir="rtl"] div.index.widgeted li.html5 { backgrou>-right: 18px } [dir="rtl"] div.index.widgeted li.html5 { backgrou
>nd-image: url("/files/3855/HTML5_Badge_16.png"); background-repea>nd-image: url("/files/3855/HTML5_Badge_16.png"); background-repea
>t: no-repeat; background-position: right 4px } [dir="rtl"] div.in>t: no-repeat; background-position: right 4px } [dir="rtl"] div.in
>dex.widgeted span { padding-right:24px } /* Add widgeted index, a>dex.widgeted span { padding-right:24px } /* Add widgeted index, a
>dding a Webcomponent badge of the li element if class="webcomp" *>dding a Webcomponent badge of the li element if class="webcomp" *
>/ div.index.widgeted li.webcomp::after { font-family: FontAwesome>/ div.index.widgeted li.webcomp::after { font-family: FontAwesome
>; content:" \f085";} /* Quicknav template styles : https://develo>; content:" \f085";} /* Quicknav template styles : https://develo
>per.mozilla.org/en-US/docs/Template:quicknav -------- */ #wikiArt>per.mozilla.org/en-US/docs/Template:quicknav -------- */ #wikiArt
>icle { position: relative; } .quicknav { position: fixed; top: 23>icle { position: relative; } .quicknav { position: fixed; top: 23
>7px; left: 33px; background: #FFF; z-index: 1 } .quicknav dl { ma>7px; left: 33px; background: #FFF; z-index: 1 } .quicknav dl { ma
>x-width: 0; max-height: 300px; overflow: auto; margin: 0; padding>x-width: 0; max-height: 300px; overflow: auto; margin: 0; padding
>: 10px 0; border: 1px solid transparent; border-left: none -webki>: 10px 0; border: 1px solid transparent; border-left: none -webki
>t-transition: border .5s ease .1s, max-width .5s ease .1s, paddin>t-transition: border .5s ease .1s, max-width .5s ease .1s, paddin
>g .5s linear .1s; -moz-transition: border .5s ease .1s, max-width>g .5s linear .1s; -moz-transition: border .5s ease .1s, max-width
> .5s ease .1s, padding .5s linear .1s; -ms-transition: border .5s> .5s ease .1s, padding .5s linear .1s; -ms-transition: border .5s
> ease .1s, max-width .5s ease .1s, padding .5s linear .1s; -o-tra> ease .1s, max-width .5s ease .1s, padding .5s linear .1s; -o-tra
>nsition: border .5s ease .1s, max-width .5s ease .1s, padding .5s>nsition: border .5s ease .1s, max-width .5s ease .1s, padding .5s
> linear .1s; transition: border .5s ease .1s, max-width .5s ease > linear .1s; transition: border .5s ease .1s, max-width .5s ease 
>.1s, padding .5s linear .1s } .quicknav dt, .quicknav dd { margin>.1s, padding .5s linear .1s } .quicknav dt, .quicknav dd { margin
>: 0; padding: 0; white-space: nowrap } .quicknav dt { font-weight>: 0; padding: 0; white-space: nowrap } .quicknav dt { font-weight
>: 700 } .quicknav dd + dt { margin-top: .5em } .quicknav:hover dl>: 700 } .quicknav dd + dt { margin-top: .5em } .quicknav:hover dl
> { max-width: 300px; padding: 10px 20px 10px 10px; border-color: > { max-width: 300px; padding: 10px 20px 10px 10px; border-color: 
>#ECECE7 } .quicknav .showme { display: block; position: absolute;>#ECECE7 } .quicknav .showme { display: block; position: absolute;
> top: 10px; left: -31px; width: 30px; font: 2em sans-serif; color> top: 10px; left: -31px; width: 30px; font: 2em sans-serif; color
>: #CCC; text-align: center; background: #FFF; border-radius: 5px >: #CCC; text-align: center; background: #FFF; border-radius: 5px 
>0 0 5px; border: 1px solid #ECECE7; border-right: none } .quickna>0 0 5px; border: 1px solid #ECECE7; border-right: none } .quickna
>v:hover .showme { color: #333; } .cleared { clear: both } /* This>v:hover .showme { color: #333; } .cleared { clear: both } /* This
> style has problem ! Style attribute of BR element is not work in> style has problem ! Style attribute of BR element is not work in
> Kuma */ .clearLeft { clear: left } /* ltr page only ? */ span.co> Kuma */ .clearLeft { clear: left } /* ltr page only ? */ span.co
>mment { display:none; } #wikiArticle .breadcrumbs { display: bloc>mment { display:none; } #wikiArticle .breadcrumbs { display: bloc
>k; margin-bottom: 1em } /* The HTML5 landing page has some specia>k; margin-bottom: 1em } /* The HTML5 landing page has some specia
>l-case stuff, handled here */ /* table.html5ArticleToc { border-w>l-case stuff, handled here */ /* table.html5ArticleToc { border-w
>idth: 5px }*/ table.html5ArticleToc { border-style: none; border->idth: 5px }*/ table.html5ArticleToc { border-style: none; border-
>width: 0; background-color: transparent; border-color: transparen>width: 0; background-color: transparent; border-color: transparen
>t; width: 100%;} .html5ArticleToc thead th { padding: .5em 1em } >t; width: 100%;} .html5ArticleToc thead th { padding: .5em 1em } 
>.html5ArticleToc tbody td { vertical-align: middle } .html5Articl>.html5ArticleToc tbody td { vertical-align: middle } .html5Articl
>eToc ul { margin: 0; padding: 0 } .html5ArticleToc ul li { displa>eToc ul { margin: 0; padding: 0 } .html5ArticleToc ul li { displa
>y: inline; margin: 0 .25em } /* The syntax box: the first one is >y: inline; margin: 0 .25em } /* The syntax box: the first one is 
>now used anywhere (DOM, JS, CSS, ...) The twoparts is used for CS>now used anywhere (DOM, JS, CSS, ...) The twoparts is used for CS
>S properties */ pre.syntaxbox { margin-bottom: 1em; background-co>S properties */ pre.syntaxbox { margin-bottom: 1em; background-co
>lor: #ffe; } html:not(.redesign) pre.syntaxbox { border: 2px soli>lor: #ffe; } html:not(.redesign) pre.syntaxbox { border: 2px soli
>d #ccc; border-radius: 10px; } pre.twopartsyntaxbox { margin-bott>d #ccc; border-radius: 10px; } pre.twopartsyntaxbox { margin-bott
>om: 0; background-color: #ffe; } html:not(.redesign) pre.twoparts>om: 0; background-color: #ffe; } html:not(.redesign) pre.twoparts
>yntaxbox { border:2px solid #bbb; border-radius: 10px 10px 0 0; }>yntaxbox { border:2px solid #bbb; border-radius: 10px 10px 0 0; }
> pre.twopartsyntaxbox + pre { border-top: none; margin-top: 0 } h> pre.twopartsyntaxbox + pre { border-top: none; margin-top: 0 } h
>tml:not(.redesign) pre.twopartsyntaxbox + pre { border: 2px solid>tml:not(.redesign) pre.twopartsyntaxbox + pre { border: 2px solid
> #bbb; border-radius: 0 0 10px 10px; } table.withoutBorder, table> #bbb; border-radius: 0 0 10px 10px; } table.withoutBorder, table
>.withoutBorder td, table.withoutBorder tr, table.withoutBorder th>.withoutBorder td, table.withoutBorder tr, table.withoutBorder th
> { border: none } td.horizontalLine { border-left: none } td.colu> { border: none } td.horizontalLine { border-left: none } td.colu
>mn { border-bottom: none } td.bottomPart { border-top: none } /* >mn { border-bottom: none } td.bottomPart { border-top: none } /* 
>Use the verticalText class on a table cell to rotate its contents>Use the verticalText class on a table cell to rotate its contents
> 90° */ td.verticalText { width: 3em; -webkit-transform: rotate(-> 90° */ td.verticalText { width: 3em; -webkit-transform: rotate(-
>90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90d>90deg); -moz-transform: rotate(-90deg); -o-transform: rotate(-90d
>eg); transform: rotate(-90deg) } table.blockTable { border-collap>eg); transform: rotate(-90deg) } table.blockTable { border-collap
>se: collapse } table.blockTable, table.blockTable td { margin: 1p>se: collapse } table.blockTable, table.blockTable td { margin: 1p
>x; padding: 1px } table.blockTable .verticalColumn { border-left:>x; padding: 1px } table.blockTable .verticalColumn { border-left:
> none; border-right: none } /* The index page for HTML / CSS */ d> none; border-right: none } /* The index page for HTML / CSS */ d
>iv.index { -webkit-columns: 16em; -moz-column-width: 16em; column>iv.index { -webkit-columns: 16em; -moz-column-width: 16em; column
>s: 16em } div.index > span { font-family: Georgia, Times, 'Tim>s: 16em } div.index > span { font-family: Georgia, Times, 'Tim
>es New Roman', serif; font-size: 1.6em } div.index ul, div.index >es New Roman', serif; font-size: 1.6em } div.index ul, div.index 
>ol { margin-left: 0; padding-left: 0; list-style-type: none } /* >ol { margin-left: 0; padding-left: 0; list-style-type: none } /* 
>Stuff used for the syntax information about CSS, HTML, and so for>Stuff used for the syntax information about CSS, HTML, and so for
>th */ /* ul.cssprop box used by each CSS Property reference page*>th */ /* ul.cssprop box used by each CSS Property reference page*
>/ .cssprop { display: table; padding: 11px 22px; background-color>/ .cssprop { display: table; padding: 11px 22px; background-color
>: #eef } .redesign .cssprop { background-color: rgba(255, 203, 0,>: #eef } .redesign .cssprop { background-color: rgba(255, 203, 0,
> 0.1); } [dir="ltr"] .cssprop { clear: left; border-left: .15em s> 0.1); } [dir="ltr"] .cssprop { clear: left; border-left: .15em s
>olid } [dir="rtl"] .cssprop { clear: right; border-right: .15em s>olid } [dir="rtl"] .cssprop { clear: right; border-right: .15em s
>olid } .redesign[dir="ltr"] .cssprop { border-left: 6px solid rgb>olid } .redesign[dir="ltr"] .cssprop { border-left: 6px solid rgb
>a(255,203,0,0.5); } .redesign[dir="rtl"] .cssprop { border-right:>a(255,203,0,0.5); } .redesign[dir="rtl"] .cssprop { border-right:
>6px solid rgba(255,203,0,0.5); } .cssprop li { display: table-row>6px solid rgba(255,203,0,0.5); } .cssprop li { display: table-row
>; padding: 3px; margin: 0 } .cssprop li dfn { display: table-cell>; padding: 3px; margin: 0 } .cssprop li dfn { display: table-cell
>; padding: 0 5px; border-bottom: none; white-space: pre; cursor: >; padding: 0 5px; border-bottom: none; white-space: pre; cursor: 
>inherit } .cssprop li dfn:after { content: ":" } .cssprop li li {>inherit } .cssprop li dfn:after { content: ":" } .cssprop li li {
> display: list-item; list-style-type: disc; line-height: 1 } /* u> display: list-item; list-style-type: disc; line-height: 1 } /* u
>l.htmlelt box used by each HTML Element reference page */ .htmlel>l.htmlelt box used by each HTML Element reference page */ .htmlel
>t { display: table; padding: 11px 22px; background-color: #fe9 } >t { display: table; padding: 11px 22px; background-color: #fe9 } 
>.redesign .htmlelt { background-color:rgba(255,149,0,0.1); } [dir>.redesign .htmlelt { background-color:rgba(255,149,0,0.1); } [dir
>="ltr"] .htmlelt { clear: left; border-left: .15em solid } [dir=">="ltr"] .htmlelt { clear: left; border-left: .15em solid } [dir="
>rtl"] .htmlelt { clear: right; border-right: .15em solid } .redes>rtl"] .htmlelt { clear: right; border-right: .15em solid } .redes
>ign[dir="ltr"] .htmlelt { border-left:6px solid rgba(255,149,0,0.>ign[dir="ltr"] .htmlelt { border-left:6px solid rgba(255,149,0,0.
>5); } .redesign[dir="rtl"] .htmlelt { border-right:6px solid rgba>5); } .redesign[dir="rtl"] .htmlelt { border-right:6px solid rgba
>(255,149,0,0.5); } .htmlelt li { display: table-row; padding: 3px>(255,149,0,0.5); } .htmlelt li { display: table-row; padding: 3px
>; margin: 0; text-align: left } .htmlelt li dfn { display: table->; margin: 0; text-align: left } .htmlelt li dfn { display: table-
>cell; padding: 0 5px; border-bottom: none; white-space: pre; curs>cell; padding: 0 5px; border-bottom: none; white-space: pre; curs
>or: inherit } .htmlelt li dfn:after { content: ":" } .htmlelt li >or: inherit } .htmlelt li dfn:after { content: ":" } .htmlelt li 
>li { display: list-item; list-style-type: disc; line-height: 1 } >li { display: list-item; list-style-type: disc; line-height: 1 } 
>/* ul.audionodebox used by each AudioNode object reference page*/>/* ul.audionodebox used by each AudioNode object reference page*/
> .audionodebox { display: table; padding: 11px 22px; background-c> .audionodebox { display: table; padding: 11px 22px; background-c
>olor: #fee } .redesign .audionodebox { background-color:rgba(117,>olor: #fee } .redesign .audionodebox { background-color:rgba(117,
>195,165,0.1); } [dir="ltr"] .audionodebox { clear: left; border-l>195,165,0.1); } [dir="ltr"] .audionodebox { clear: left; border-l
>eft: .15em solid } [dir="rtl"] .audionodebox { clear: right; bord>eft: .15em solid } [dir="rtl"] .audionodebox { clear: right; bord
>er-right: .15em solid } .redesign[dir="ltr"] .audionodebox { bord>er-right: .15em solid } .redesign[dir="ltr"] .audionodebox { bord
>er-left:6px solid rgba(117,195,165,0.5); } .redesign[dir="rtl"] .>er-left:6px solid rgba(117,195,165,0.5); } .redesign[dir="rtl"] .
>audionodebox { border-right:6px solid rgba(117,195,165,0.5); } .a>audionodebox { border-right:6px solid rgba(117,195,165,0.5); } .a
>udionodebox li, .summary-box-js li, .summary-box-events li { disp>udionodebox li, .summary-box-js li, .summary-box-events li { disp
>lay: table-row; padding: 3px; margin: 0; text-align: left } .audi>lay: table-row; padding: 3px; margin: 0; text-align: left } .audi
>onodebox li dfn, .summary-box-js li dfn, .summary-box-events li d>onodebox li dfn, .summary-box-js li dfn, .summary-box-events li d
>fn { display: table-cell; padding: 0 5px; border-bottom: none; wh>fn { display: table-cell; padding: 0 5px; border-bottom: none; wh
>ite-space: pre; cursor: inherit } .audionodebox li dfn:after, .su>ite-space: pre; cursor: inherit } .audionodebox li dfn:after, .su
>mmary-box-js li dfn:after, .summary-box-events li dfn:after { con>mmary-box-js li dfn:after, .summary-box-events li dfn:after { con
>tent: ":" } .audionodebox li li, .summary-box-js li li, .summary->tent: ":" } .audionodebox li li, .summary-box-js li li, .summary-
>box-events li li { display: list-item; list-style-type: disc; lin>box-events li li { display: list-item; list-style-type: disc; lin
>e-height: 1 } /* https://developer.mozilla.org/en-US/docs/Templat>e-height: 1 } /* https://developer.mozilla.org/en-US/docs/Templat
>e:HTML:Element_Navigation */ table.HTMLElmNav { margin: 1em auto;>e:HTML:Element_Navigation */ table.HTMLElmNav { margin: 1em auto;
> border-width: 5px } table.HTMLElmNav th, table.HTMLElmNav td { t> border-width: 5px } table.HTMLElmNav th, table.HTMLElmNav td { t
>ext-align: center } .method { margin-left: 10px; margin-bottom: 2>ext-align: center } .method { margin-left: 10px; margin-bottom: 2
>em; margin-top: 1em } .method > .name { display: block; font-s>em; margin-top: 1em } .method > .name { display: block; font-s
>ize: 13pt; margin-bottom: .2em } .method > .name > .param: >ize: 13pt; margin-bottom: .2em } .method > .name > .param: 
>after { content: ","; padding-right: .5em } .method > .name &g>after { content: ","; padding-right: .5em } .method > .name &g
>t; .param: last-of-type: after { content: "" } .method > .name>t; .param: last-of-type: after { content: "" } .method > .name
> > .param > .name: after { content: " as "; font-weight: no> > .param > .name: after { content: " as "; font-weight: no
>rmal } .method > .name > .param: not(.required) { font-styl>rmal } .method > .name > .param: not(.required) { font-styl
>e: italic } .method > .name > .param: not(.required): befor>e: italic } .method > .name > .param: not(.required): befor
>e { content: "[" } .method > .name > .param: not(.required)>e { content: "[" } .method > .name > .param: not(.required)
>: after { content: "]" } .method > .description { display: blo>: after { content: "]" } .method > .description { display: blo
>ck; font-size: 10pt; color: #444; font-style: italic; margin-bott>ck; font-size: 10pt; color: #444; font-style: italic; margin-bott
>om: 7px } .method > .name > .returns: before { content: " r>om: 7px } .method > .name > .returns: before { content: " r
>eturns "; font-weight: normal; font-style: italic } .method > >eturns "; font-weight: normal; font-style: italic } .method > 
>.name > .returns { font-weight: 700 } .method > .params { d>.name > .returns { font-weight: 700 } .method > .params { d
>isplay: block; color: #555 } .method > .params > .param { d>isplay: block; color: #555 } .method > .params > .param { d
>isplay: block; margin-bottom: 5px } .method > .params > .pa>isplay: block; margin-bottom: 5px } .method > .params > .pa
>ram > .name { font-weight: 700; margin-right: .5em; min-width:>ram > .name { font-weight: 700; margin-right: .5em; min-width:
> 80px; display: inline-block } .method > .params > .param &> 80px; display: inline-block } .method > .params > .param &
>gt; .description { display: inline-block; width: 300px; vertical->gt; .description { display: inline-block; width: 300px; vertical-
>align: top; margin-right: 30px } .method > .params > .param>align: top; margin-right: 30px } .method > .params > .param
> > .type { display: inline-block; width: 150px; vertical-align> > .type { display: inline-block; width: 150px; vertical-align
>: top; font-weight: 700 } .method > .params > .param > .>: top; font-weight: 700 } .method > .params > .param > .
>type: before { content: "Type "; color: #888; font-weight: normal>type: before { content: "Type "; color: #888; font-weight: normal
> } .method > .params > .param > .default { display: inli> } .method > .params > .param > .default { display: inli
>ne-block; width: 150px; vertical-align: top; font-weight: 700 } .>ne-block; width: 150px; vertical-align: top; font-weight: 700 } .
>method > .params > .param > .default: before { content: >method > .params > .param > .default: before { content: 
>"Default "; color: #888; font-weight: normal } /* version compati>"Default "; color: #888; font-weight: normal } /* version compati
>bility banners and notes */ .geckoVersionNote { background-color:>bility banners and notes */ .geckoVersionNote { background-color:
> #E0E0FF; background-image: -moz-radial-gradient(0px 0 45deg, cir> #E0E0FF; background-image: -moz-radial-gradient(0px 0 45deg, cir
>cle farthest-corner, #E0E0FF 0%, #F8F8FF 80%); border-left: 5px s>cle farthest-corner, #E0E0FF 0%, #F8F8FF 80%); border-left: 5px s
>olid #008 } .geckoVersionNote p { padding-left: 4px; border: 0 } >olid #008 } .geckoVersionNote p { padding-left: 4px; border: 0 } 
>.geckoVersionHeading { background-color: #008; background-image: >.geckoVersionHeading { background-color: #008; background-image: 
>-moz-linear-gradient(left, #008 50%, #e0e0ff 80%); color: #fff; f>-moz-linear-gradient(left, #008 50%, #e0e0ff 80%); color: #fff; f
>ont: 16px/1.7 Verdana, Tahoma, sans-serif; margin-top: 0; margin->ont: 16px/1.7 Verdana, Tahoma, sans-serif; margin-top: 0; margin-
>left: 0; margin-bottom: 4px; height: 42px } .geckoVersionHeading >left: 0; margin-bottom: 4px; height: 42px } .geckoVersionHeading 
>a:link { color: #ddd } .geckoVersionHeading a:visited { color: #e>a:link { color: #ddd } .geckoVersionHeading a:visited { color: #e
>ee } .geckoVersionHeading a:hover, .geckoVersionHeading a:focus {>ee } .geckoVersionHeading a:hover, .geckoVersionHeading a:focus {
> color: #fdd } .experimentalIcon { display: inline-block; width:4> color: #fdd } .experimentalIcon { display: inline-block; width:4
>px; height:4px; color:orange; background-color:white; border: 3px>px; height:4px; color:orange; background-color:white; border: 3px
> solid orange; } .nonstandardIcon { display: inline-block; width:> solid orange; } .nonstandardIcon { display: inline-block; width:
>8px; height:8px; color:red; background-color:red; border: 1px sol>8px; height:8px; color:red; background-color:red; border: 1px sol
>id red; } .obsoleteIcon { display: inline-block; width:8px; heigh>id red; } .obsoleteIcon { display: inline-block; width:8px; heigh
>t:8px; color:black; background-color:black; border: 1px solid bla>t:8px; color:black; background-color:black; border: 1px solid bla
>ck; } .deprecatedIcon { display: inline-block; width:4px; height:>ck; } .deprecatedIcon { display: inline-block; width:4px; height:
>4px; color:black; background-color:white; border: 3px solid black>4px; color:black; background-color:white; border: 3px solid black
>; } /* Used to to create icon-badged APIs inline */ .indexListRow>; } /* Used to to create icon-badged APIs inline */ .indexListRow
> { display: -ms-flexbox; display: -webkit-flex; display: flex; -w> { display: -ms-flexbox; display: -webkit-flex; display: flex; -w
>ebkit-flex-direction: row; -ms-flex-direction: row; flex-directio>ebkit-flex-direction: row; -ms-flex-direction: row; flex-directio
>n: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: >n: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: 
>wrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; >wrap; -webkit-justify-content: flex-start; -ms-flex-pack: start; 
>justify-content: flex-start; -webkit-align-content: stretch; -ms->justify-content: flex-start; -webkit-align-content: stretch; -ms-
>flex-line-pack: stretch; align-content: stretch; -webkit-align-it>flex-line-pack: stretch; align-content: stretch; -webkit-align-it
>ems: flex-start; -ms-flex-align: start; align-items: flex-start; >ems: flex-start; -ms-flex-align: start; align-items: flex-start; 
>/*width:100%;*/ } .indexListTerm { -webkit-order: 0; -ms-flex-ord>/*width:100%;*/ } .indexListTerm { -webkit-order: 0; -ms-flex-ord
>er: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex>er: 0; order: 0; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex
>: 0 1 auto; -webkit-align-self: flex-start; -ms-flex-item-align: >: 0 1 auto; -webkit-align-self: flex-start; -ms-flex-item-align: 
>start; align-self: flex-start; } .indexListBadges { -webkit-order>start; align-self: flex-start; } .indexListBadges { -webkit-order
>: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-fle>: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 0 1 auto; -ms-fle
>x: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-i>x: 0 1 auto; flex: 0 1 auto; -webkit-align-self: auto; -ms-flex-i
>tem-align: auto; align-self: flex-end; padding-left: 6px; margin->tem-align: auto; align-self: flex-end; padding-left: 6px; margin-
>right:6px; } .badge { position: relative; top: -2px; display: inl>right:6px; } .badge { position: relative; top: -2px; display: inl
>ine-block; cursor: default; border: 1px solid #aaa; border-radius>ine-block; cursor: default; border: 1px solid #aaa; border-radius
>: 8px; padding: .1em .6em; font-size: 70%; font-weight: 700; heig>: 8px; padding: .1em .6em; font-size: 70%; font-weight: 700; heig
>ht: 1.4em; vertical-align: middle; line-height: 1.3; } .badgeText>ht: 1.4em; vertical-align: middle; line-height: 1.3; } .badgeText
> { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; > { -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; 
>hyphens: none; } .banner { display:block; overflow:hidden; font-s>hyphens: none; } .banner { display:block; overflow:hidden; font-s
>ize: 14px; font-weight: normal; margin: 10px 0px; padding: 2px 10>ize: 14px; font-weight: normal; margin: 10px 0px; padding: 2px 10
>px; } html:not(.redesign) .banner { border: 1px solid #aaa; borde>px; } html:not(.redesign) .banner { border: 1px solid #aaa; borde
>r-radius: 8px; } .redesign .banner { font-size:12px; } .bannerHea>r-radius: 8px; } .redesign .banner { font-size:12px; } .bannerHea
>ding { text-align: center; font-weight: bold; padding-bottom: 2px>ding { text-align: center; font-weight: bold; padding-bottom: 2px
>; } .redesign .bannerHeading { text-align: inherit; } .bannerText>; } .redesign .bannerHeading { text-align: inherit; } .bannerText
> { text-align: center; font-weight: normal; } .icon { padding-lef> { text-align: center; font-weight: normal; } .icon { padding-lef
>t: 3.1em } [dir=rtl] .icon { padding-left: .8em; padding-right: 3>t: 3.1em } [dir=rtl] .icon { padding-left: .8em; padding-right: 3
>.1em; } .icon:before { content: ""; position: absolute; left: -2p>.1em; } .icon:before { content: ""; position: absolute; left: -2p
>x; top: 50%; margin-top: -1.5em; width: 2.8em; height: 2.8em; bac>x; top: 50%; margin-top: -1.5em; width: 2.8em; height: 2.8em; bac
>kground: white no-repeat center center; background-size: 2.6em; b>kground: white no-repeat center center; background-size: 2.6em; b
>order-radius: 100%; border: 1px solid #aaa; border-right: none; b>order-radius: 100%; border: 1px solid #aaa; border-right: none; b
>ox-sizing: border-box; -moz-boxsizing: border-box; } [dir=rtl] .i>ox-sizing: border-box; -moz-boxsizing: border-box; } [dir=rtl] .i
>con:before { left: auto; right: -2px; border: 1px solid #aaa; bor>con:before { left: auto; right: -2px; border: 1px solid #aaa; bor
>der-left: none; } /* Used for badging obsolete APIs */ .nonstanda>der-left: none; } /* Used for badging obsolete APIs */ .nonstanda
>rdBadge { background: linear-gradient(to right, #f0DE00 30%, #f0f>rdBadge { background: linear-gradient(to right, #f0DE00 30%, #f0f
>f19); color: black; text-shadow: 1px 1px 0 #ddd; } /* Used for ba>f19); color: black; text-shadow: 1px 1px 0 #ddd; } /* Used for ba
>dging Gecko minimum version requirements */ .geckoVersionBadge { >dging Gecko minimum version requirements */ .geckoVersionBadge { 
>background: linear-gradient(to right, rgb(215, 236, 161) 30%, rgb>background: linear-gradient(to right, rgb(215, 236, 161) 30%, rgb
>(204, 227, 144)); color: black; text-shadow: 1px 1px 0 #ddd; bord>(204, 227, 144)); color: black; text-shadow: 1px 1px 0 #ddd; bord
>er-color: rgb(129, 142, 97); } .redesign .geckoVersionBadge { bac>er-color: rgb(129, 142, 97); } .redesign .geckoVersionBadge { bac
>kground: rgba(117,195,165,0.44); border:5px solid rgba(0,0,0,0.05>kground: rgba(117,195,165,0.44); border:5px solid rgba(0,0,0,0.05
>); } /* Used for badging Firefox minimum version requirements */ >); } /* Used for badging Firefox minimum version requirements */ 
>.firefoxVersionBadge { background-color: #FEDF9E; background-imag>.firefoxVersionBadge { background-color: #FEDF9E; background-imag
>e: linear-gradient(to right, #FEDF9E 30%, #FEF1D4); background-re>e: linear-gradient(to right, #FEDF9E 30%, #FEF1D4); background-re
>peat: no-repeat; background-size: contain; overflow: hidden; colo>peat: no-repeat; background-size: contain; overflow: hidden; colo
>r: black; text-shadow: 1px 1px 0 #ccc; white-space: nowrap; } .fi>r: black; text-shadow: 1px 1px 0 #ccc; white-space: nowrap; } .fi
>refoxVersionBadge a:link { color: black; text-decoration: underli>refoxVersionBadge a:link { color: black; text-decoration: underli
>ne; } .firefoxVersionBadge a:visited { color: black; text-decorat>ne; } .firefoxVersionBadge a:visited { color: black; text-decorat
>ion: underline; } .firefoxVersionBadge a:hover { color: #853; tex>ion: underline; } .firefoxVersionBadge a:hover { color: #853; tex
>t-decoration: none; } .firefoxVersionBadge a:active { color:#858;>t-decoration: none; } .firefoxVersionBadge a:active { color:#858;
> text-decoration: none; } /* Used for badging APIs not implemente> text-decoration: none; } /* Used for badging APIs not implemente
>d in Firefox */ .unimplementedBadge { background-color: lightpink>d in Firefox */ .unimplementedBadge { background-color: lightpink
>; color: black; text-shadow: 1px 1px 0 #ddd; border-color: deeppi>; color: black; text-shadow: 1px 1px 0 #ddd; border-color: deeppi
>nk; } /* Used for badging non-standard APIs */ .obsoleteBadge { b>nk; } /* Used for badging non-standard APIs */ .obsoleteBadge { b
>ackground: linear-gradient(to right, #FEBCBC 30%, #fffff0); color>ackground: linear-gradient(to right, #FEBCBC 30%, #fffff0); color
>: black; text-shadow: 1px 1px 0 #ddd; border-color: #f00; } /* Us>: black; text-shadow: 1px 1px 0 #ddd; border-color: #f00; } /* Us
>ed for badging deprecated APIs */ .deprecatedBadge { background: >ed for badging deprecated APIs */ .deprecatedBadge { background: 
>linear-gradient(to right, #ccccff 30%, #eeeeff); color: #000; tex>linear-gradient(to right, #ccccff 30%, #eeeeff); color: #000; tex
>t-shadow: 1px 1px 0 #ddd; border-color: blue; } /* Used for badgi>t-shadow: 1px 1px 0 #ddd; border-color: blue; } /* Used for badgi
>ng experimental APIs */ .experimentalBadge { background: linear-g>ng experimental APIs */ .experimentalBadge { background: linear-g
>radient(to right, #ffefd9 40%, #fffde0); color: #000; text-shadow>radient(to right, #ffefd9 40%, #fffde0); color: #000; text-shadow
>: 1px 1px 0 #ddd; } /* Used for badging privileged APIs */ .privi>: 1px 1px 0 #ddd; } /* Used for badging privileged APIs */ .privi
>legedBadge { background: linear-gradient(to right, #FFBD19 30%, #>legedBadge { background: linear-gradient(to right, #FFBD19 30%, #
>ffb200); color: #000; text-shadow: 1px 1px 0 #ddd; } [dir=rtl] .p>ffb200); color: #000; text-shadow: 1px 1px 0 #ddd; } [dir=rtl] .p
>rivilegedBadge { background: linear-gradient(to left, #FFBD19 30%>rivilegedBadge { background: linear-gradient(to left, #FFBD19 30%
>, #ffb200); } .icon.privilegedBadge:before { background-color: or>, #ffb200); } .icon.privilegedBadge:before { background-color: or
>ange; background-image: url(https://mdn.mozillademos.org/files/50>ange; background-image: url(https://mdn.mozillademos.org/files/50
>61/firefoxos-logo-sm.png); } .sidebar-box { margin-left: 16px; ma>61/firefoxos-logo-sm.png); } .sidebar-box { margin-left: 16px; ma
>rgin-bottom: 2.5em; border-right: 1px solid #ecf1f3; padding: 12p>rgin-bottom: 2.5em; border-right: 1px solid #ecf1f3; padding: 12p
>x; background: #f1f6f8 url("img/toc-bg.png") 0 0 no-repeat; font:>x; background: #f1f6f8 url("img/toc-bg.png") 0 0 no-repeat; font:
> 12px Verdana, Tahoma, sans-serif } .sidebar-box h2, .sidebar-box> 12px Verdana, Tahoma, sans-serif } .sidebar-box h2, .sidebar-box
> h3, .sidebar-box h5 { margin-bottom: .5em; font-family: inherit;> h3, .sidebar-box h5 { margin-bottom: .5em; font-family: inherit;
> font-weight: 700 } .sidebar-box h2 { font-size: 1.5em } .sidebar> font-weight: 700 } .sidebar-box h2 { font-size: 1.5em } .sidebar
>-box h3 { font-size: 1.1em } .sidebar-box h5 { font-size: .9em } >-box h3 { font-size: 1.1em } .sidebar-box h5 { font-size: .9em } 
>.sidebar-box > ul { float: left; text-align: left; display: bl>.sidebar-box > ul { float: left; text-align: left; display: bl
>ock; padding: 0; margin: auto 0; position: relative } .sidebar-bo>ock; padding: 0; margin: auto 0; position: relative } .sidebar-bo
>x ul > li { list-style-type: none } .tab-content-box { border->x ul > li { list-style-type: none } .tab-content-box { border-
>right: 1px solid #ecf1f3; margin-left: 16px; padding: 12px; backg>right: 1px solid #ecf1f3; margin-left: 16px; padding: 12px; backg
>round: #fff; font: 12px Verdana, Tahoma, sans-serif } .tab-conten>round: #fff; font: 12px Verdana, Tahoma, sans-serif } .tab-conten
>t-box h2, .tab-content-box h3, .tab-content-box h5 { margin-botto>t-box h2, .tab-content-box h3, .tab-content-box h5 { margin-botto
>m: .5em; font-family: inherit; font-weight: 700 } .tab-content-bo>m: .5em; font-family: inherit; font-weight: 700 } .tab-content-bo
>x h2 { font-size: 1.5em } .tab-content-box h3 { font-size: 1.1em >x h2 { font-size: 1.5em } .tab-content-box h3 { font-size: 1.1em 
>} .tab-content-box h5 { font-size: .9em } #menuFiller { display: >} .tab-content-box h5 { font-size: .9em } #menuFiller { display: 
>block } /* Horizontal tab boxes */ .htab { margin: 0 auto 1em; di>block } /* Horizontal tab boxes */ .htab { margin: 0 auto 1em; di
>splay: inline-block; } .htab>ul>li { width: 150px; height: >splay: inline-block; } .htab>ul>li { width: 150px; height: 
>28px; list-style-type: none; display: inline; padding-bottom: 3px>28px; list-style-type: none; display: inline; padding-bottom: 3px
>; border: 1px solid #ddd; border-radius: 3px 3px 0 0; padding-top>; border: 1px solid #ddd; border-radius: 3px 3px 0 0; padding-top
>: 5px; text-align: left; font-size: 13px; font-weight: normal; ma>: 5px; text-align: left; font-size: 13px; font-weight: normal; ma
>rgin: auto; position: relative; padding-left: 6px; padding-right:>rgin: auto; position: relative; padding-left: 6px; padding-right:
> 6px; border-bottom: none; opacity: .5; -ms-filter: "progid:DXIma> 6px; border-bottom: none; opacity: .5; -ms-filter: "progid:DXIma
>geTransform.Microsoft.Alpha(Opacity=50)"; filter: progid:DXImageT>geTransform.Microsoft.Alpha(Opacity=50)"; filter: progid:DXImageT
>ransform.Microsoft.Alpha(Opacity=50); cursor: pointer; } .htab&gt>ransform.Microsoft.Alpha(Opacity=50); } .htab>ul>li.selecte
>;ul>li.selected { opacity: 1 !important; -ms-filter: "progid:D>d { opacity: 1 !important; -ms-filter: "progid:DXImageTransform.M
>XImageTransform.Microsoft.Alpha(Opacity=100)"; filter: progid:DXI>icrosoft.Alpha(Opacity=100)"; filter: progid:DXImageTransform.Mic
>mageTransform.Microsoft.Alpha(Opacity=100); border: 1px solid #dd>rosoft.Alpha(Opacity=100); border: 1px solid #ddd; border-bottom:
>d; border-bottom: none; z-index: 10; background-color: rgba(234, > none; z-index: 10; background-color: rgba(234, 239, 242,1) !impo
>239, 242,1) !important; position: relative; cursor: pointer; font>rtant; position: relative; font-weight: bold; } .htab>ul>li
>-weight: bold; } .htab>ul>li.selected a { color: #000; } .h>>a { cursor: pointer; } .htab>ul>li.selected a { color: 
>tab>ul { width: 150px; text-align: left; display: inline; padd>#000; } .htab>ul { width: 150px; text-align: left; display: in
>ing: 0; margin: 0 auto; position: relative; top: 0; } .htab>di>line; padding: 0; margin: 0 auto; position: relative; top: 0; } .
>v { background-color: #f1f6f8; margin-top: 0; border: 1px solid #>htab>div { background-color: #f1f6f8; margin-top: 0; border: 1
>ddd; padding: 12px; position: relative; z-index: 9; word-wrap: br>px solid #ddd; padding: 12px; position: relative; z-index: 9; wor
>eak-word; } /* Compatibility tables */ table.compat-table { borde>d-wrap: break-word; } /* Compatibility tables */ table.compat-tab
>r-color: #bbb; margin: 0 } .redesign table.compat-table { border->le { border-color: #bbb; margin: 0 } .redesign table.compat-table
>color:rgba(0,0,0,0); } table.compat-table td { padding: 5px; bord> { border-color:rgba(0,0,0,0); } table.compat-table td { padding:
>er: 1px solid #ccc; background: #fff; vertical-align: top; word-w> 5px; border: 1px solid #ccc; background: #fff; vertical-align: t
>rap: break-word } .redesign table.compat-table td { border:1px so>op; word-wrap: break-word } .redesign table.compat-table td { bor
>lid rgba(212,221,228,0.25); font-size:12px; } table.compat-table >der:1px solid rgba(212,221,228,0.25); font-size:12px; } table.com
>th, table.compat-table td.header { border: 1px solid #bbb; paddin>pat-table th, table.compat-table td.header { border: 1px solid #b
>g: 0 5px; background: #eee; font-weight: 700 } .redesign table.co>bb; padding: 0 5px; background: #eee; font-weight: 700 } .redesig
>mpat-table th, .redesign table.compat-table td.header { border:1p>n table.compat-table th, .redesign table.compat-table td.header {
>x solid rgba(212,221,228,0); background:none; font-weight:200; fo> border:1px solid rgba(212,221,228,0); background:none; font-weig
>nt-family:'Open Sans Light',sans-serif; font-size:16px; line-heig>ht:200; font-family:'Open Sans Light',sans-serif; font-size:16px;
>ht:100%; padding:2px 4px 8px; } div.action-driven { display: inli> line-height:100%; padding:2px 4px 8px; } div.action-driven { dis
>ne-block; float: none; min-height: 8.5em; margin: .8em; box-shado>play: inline-block; float: none; min-height: 8.5em; margin: .8em;
>w: .2em .1em .1em #808080; vertical-align: top; } div.action-driv> box-shadow: .2em .1em .1em #808080; vertical-align: top; } div.a
>en > div { font: 400 20px 'Bebas Neue', 'League Gothic', Haett>ction-driven > div { font: 400 20px 'Bebas Neue', 'League Goth
>enschweiler, Impact, 'Arial Narrow', Meiryo, sans-serif; text-tra>ic', Haettenschweiler, Impact, 'Arial Narrow', Meiryo, sans-serif
>nsform: uppercase } /* standard coloring */ .notice.experimental >; text-transform: uppercase } /* standard coloring */ .notice.exp
>{ border-color: #09d; color: 0; background-color: #C9EDFC;clear:n>erimental { border-color: #09d; color: 0; background-color: #C9ED
>one;} .redesign .notice.experimental { background-color:rgba(255,>FC;clear:none;} .redesign .notice.experimental { background-color
>203,0,0.5); border-color:rgba(0,0,0,0.05); border-style:solid!imp>:rgba(255,203,0,0.5); border-color:rgba(0,0,0,0.05); border-style
>ortant; border-width:5px!important; } /* New theme action-driven >:solid!important; border-width:5px!important; } /* New theme acti
>*/ .card-grid > li > span:first-of-type {font-weight: bold}>on-driven */ .card-grid > li > span:first-of-type {font-wei
> ul.card-grid {list-style-type: none; padding-left: 0;} ul.card-g>ght: bold} ul.card-grid {list-style-type: none; padding-left: 0;}
>rid li {margin-bottom: 25px; padding: 10px;} @media only screen a> ul.card-grid li {margin-bottom: 25px; padding: 10px;} @media onl
>nd (min-width:760px) { ul.card-grid { list-style: none outside no>y screen and (min-width:760px) { ul.card-grid { list-style: none 
>ne; padding-left: 40px; } .card-grid { border-spacing: 30px 0px; >outside none; padding-left: 40px; } .card-grid { border-spacing: 
>padding-bottom: 25px; } .card-grid > li > span:first-of-typ>30px 0px; padding-bottom: 25px; } .card-grid > li > span:fi
>e {font-weight: normal} .card-grid > li { background-color: rg>rst-of-type {font-weight: normal} .card-grid > li { background
>b(204, 204, 204); background-image: -moz-linear-gradient(center t>-color: rgb(204, 204, 204); background-image: -moz-linear-gradien
>op , rgb(221, 221, 221) 0px, rgb(187, 187, 187) 100%); border-rad>t(center top , rgb(221, 221, 221) 0px, rgb(187, 187, 187) 100%); 
>ius: 6px; background-clip: padding-box; box-shadow: 0px 2px 4px r>border-radius: 6px; background-clip: padding-box; box-shadow: 0px
>gba(0, 0, 0, 0.1); display: table-cell; margin: 3px 12px 20px; pa> 2px 4px rgba(0, 0, 0, 0.1); display: table-cell; margin: 3px 12p
>dding: 20px; position: relative; vertical-align: top; width: 200p>x 20px; padding: 20px; position: relative; vertical-align: top; w
>x; word-wrap: break-word; z-index: 1; min-height: 130px; } .card->idth: 200px; word-wrap: break-word; z-index: 1; min-height: 130px
>grid > li:before { background: none repeat scroll 0% 0% paddin>; } .card-grid > li:before { background: none repeat scroll 0%
>g-box rgb(255, 255, 255); border-radius: 5px; content: ""; left: > 0% padding-box rgb(255, 255, 255); border-radius: 5px; content: 
>1px; position: absolute; right: 1px; top: 1px; z-index: -1; } .ca>""; left: 1px; position: absolute; right: 1px; top: 1px; z-index:
>rd-grid > li img { float:left; max-width: 35%; } .double-card > -1; } .card-grid > li img { float:left; max-width: 35%; } .do
>{ width: 430px !important; } .redesign .card-grid > li:before >uble-card { width: 430px !important; } .redesign .card-grid > 
>{ background: none; border-radius: 0; } .card-grid > li span {>li:before { background: none; border-radius: 0; } .card-grid >
> display: block; font-family: 'Open Sans Light',Arial,Helvetica,s> li span { display: block; font-family: 'Open Sans Light',Arial,H
>ans-serif; font-size: 22px; letter-spacing: -1px; line-height: 22>elvetica,sans-serif; font-size: 22px; letter-spacing: -1px; line-
>px; margin-bottom: 12px; } } .redesign .card-grid > li { backg>height: 22px; margin-bottom: 12px; } } .redesign .card-grid > 
>round-color:rgba(234,239,242,0.5); border-radius: 0; box-shadow:3>li { background-color:rgba(234,239,242,0.5); border-radius: 0; bo
>px 3px 0 3px rgba(212,221,228,0.5); background-image: none; } /*->x-shadow:3px 3px 0 3px rgba(212,221,228,0.5); background-image: n
>---------------- for Topic page */ table.topicpage-table, table.t>one; } /*----------------- for Topic page */ table.topicpage-tabl
>opicpage-table td, table.topicpage-table tr, table.topicpage-tabl>e, table.topicpage-table td, table.topicpage-table tr, table.topi
>e th { border: none } .topicpage-table .section { padding-right:1>cpage-table th { border: none } .topicpage-table .section { paddi
>em} /* New theme */ dl { margin-bottom: 20px} .center .topicpage->ng-right:1em} /* New theme */ dl { margin-bottom: 20px} .center .
>table h2 { font-family: 'Open Sans Light', sans-serif } .topicpag>topicpage-table h2 { font-family: 'Open Sans Light', sans-serif }
>e-table ul {padding-left: 20px; } /* Old theme */ /* "table.topic> .topicpage-table ul {padding-left: 20px; } /* Old theme */ /* "t
>page-table h2 { --font-setting-- }" is better than this. .topicpa>able.topicpage-table h2 { --font-setting-- }" is better than this
>ge-table .Documentation, .topicpage-table .Community, .topicpage->. .topicpage-table .Documentation, .topicpage-table .Community, .
>table .Tools, .topicpage-table .Related_Topics { background-image>topicpage-table .Tools, .topicpage-table .Related_Topics { backgr
>: url('/media/img/icons-sections.png'); background-repeat: no-rep>ound-image: url('/media/img/icons-sections.png'); background-repe
>eat; margin: 0 0 .25em; padding: 18px 18px 0 65px; min-height: 48>at: no-repeat; margin: 0 0 .25em; padding: 18px 18px 0 65px; min-
>px; font: 400 28px/1 'Bebas Neue', 'League Gothic', Haettenschwei>height: 48px; font: 400 28px/1 'Bebas Neue', 'League Gothic', Hae
>ler, Impact, 'Arial Narrow', Meiryo, sans-serif; text-transform: >ttenschweiler, Impact, 'Arial Narrow', Meiryo, sans-serif; text-t
>uppercase; border: none } */ /* this is an unadorned heading, wit>ransform: uppercase; border: none } */ /* this is an unadorned he
>hout an icon */ //.topicpage-table .Heading { margin: 0 0 .25em; >ading, without an icon */ //.topicpage-table .Heading { margin: 0
>padding: 18px 18px 0 0; min-height: 48px; font: 400 28px/1 'Bebas> 0 .25em; padding: 18px 18px 0 0; min-height: 48px; font: 400 28p
> Neue', 'League Gothic', Haettenschweiler, Impact, 'Arial Narrow'>x/1 'Bebas Neue', 'League Gothic', Haettenschweiler, Impact, 'Ari
>, Meiryo, sans-serif; text-transform: uppercase; border: none } />al Narrow', Meiryo, sans-serif; text-transform: uppercase; border
>* [dir="rtl"] .topicpage-table .Documentation, [dir="rtl"] .topic>: none } /* [dir="rtl"] .topicpage-table .Documentation, [dir="rt
>page-table .Community, [dir="rtl"] .topicpage-table .Tools, [dir=>l"] .topicpage-table .Community, [dir="rtl"] .topicpage-table .To
>"rtl"] .topicpage-table .Heading, [dir="rtl"] .topicpage-table .R>ols, [dir="rtl"] .topicpage-table .Heading, [dir="rtl"] .topicpag
>elated_Topics { padding: 18px 65px 0 18px; } .topicpage-table .Do>e-table .Related_Topics { padding: 18px 65px 0 18px; } .topicpage
>cumentation { background-position: 0 0 } .topicpage-table .Commun>-table .Documentation { background-position: 0 0 } .topicpage-tab
>ity { background-position: 0 -200px } .topicpage-table .Tools { b>le .Community { background-position: 0 -200px } .topicpage-table 
>ackground-position: 0 -400px } .topicpage-table .Related_Topics {>.Tools { background-position: 0 -400px } .topicpage-table .Relate
> background-position: 0 -600px } [dir="rtl"] .topicpage-table .Do>d_Topics { background-position: 0 -600px } [dir="rtl"] .topicpage
>cumentation { background-position: right 0 } [dir="rtl"] .topicpa>-table .Documentation { background-position: right 0 } [dir="rtl"
>ge-table .Community { background-position: right -200px } [dir="r>] .topicpage-table .Community { background-position: right -200px
>tl"] .topicpage-table .Tools { background-position: right -400px > } [dir="rtl"] .topicpage-table .Tools { background-position: rig
>} [dir="rtl"] .topicpage-table .Related_Topics { background-posit>ht -400px } [dir="rtl"] .topicpage-table .Related_Topics { backgr
>ion: right -600px } */ /* for Topic Page 2 (This is Test )*/ /* U>ound-position: right -600px } */ /* for Topic Page 2 (This is Tes
>SAGE:>t )*/ /* USAGE:

Back to History