/* screen.css (59,351) */ /* --------- SCREEN.CSS --------- */ /*---------------------------------------------------------------------------- Screen CSS file for Mozilla Developer Network Created by Craig Cook - focalcurve.com on 1 June, 2010 Colors - Orange #fb9500 Green #8dc434 Blue #00b6f0 Red #ed2024 Gold #f8d575 Off-black #333 Dark red #630a0c Link #369 Hover #25a Visited #69c Font sizes - 16px * .875 = 14px (base size) 14px * 1.857 = 26px 14px * 1.714 = 24px 14px * 1.571 = 22px 14px * 1.428 = 20px 14px * 1.285 = 18px 14px * 1.142 = 16px 14px * .928 = 13px 14px * .857 = 12px 14px * .785 = 11px 14px * .714 = 10px 14px * .642 = 9px -----------------------------------------------------------------------------*/ /* @Fonts *********/ @font-face { font-family: "League Gothic"; src: url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/League_Gothic-webfont.eot'); /* IE9 */ src: url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/League_Gothic-webfont.eot') format('eot'), /* IE6-8 */ url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/League_Gothic-webfont.woff') format('woff'), /* Modern browsers */ url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/League_Gothic-webfont.ttf') format('truetype'), /* Older Webkits */ url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/League_Gothic-webfont.svg#webfont') format('svg'); /* Opera */ font-weight: normal; font-style: normal; } @font-face { font-family: "Bebas Neue"; src: url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/BebasNeue-webfont.eot'); /* IE9 */ src: url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/BebasNeue-webfont.eot') format('eot'), /* IE6-8 */ url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/BebasNeue-webfont.woff') format('woff'), /* Modern browsers */ url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/BebasNeue-webfont.ttf') format('truetype'), /* Older Webkits */ url('/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/fonts/BebasNeue-webfont.svg#webfont') format('svg'); /* Opera */ font-weight: normal; font-style: normal; } /* @Reset *********/ header, hgroup, nav, section, article, aside, footer { display: block; } html, body, form, fieldset, legend, h1, h2, h3, h4, h5, h6, dt, dd { margin: 0; padding: 0; } blockquote:before, blockquote:after, q:before, q:after { content: ""; } blockquote, q { quotes: "" ""; } fieldset, a img { border: 0; } address, caption, cite, code, dfn, th, var { font-style: inherit; font-weight: inherit; } abbr, acronym, dfn { border-bottom: 1px dotted #666; font-variant: normal; cursor: help; } input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; } table { border-collapse: collapse; border-spacing: 0; margin: 0 0 1.286em; } caption, th { text-align: left; } p, pre, blockquote, dl, ul, ol { margin: 0 0 1.286em; padding: 0; } li ul, li ol { margin-bottom: 0; } ul { list-style: none; } legend { color: inherit; } dt { font-style: italic; } dd { margin: 0 0 .5em 22px; } form ol, form ul { list-style: none; margin: 0 0 1.286em; } abbr.updated, abbr.published { border: 0; cursor: default; } /* @General elements and content *********/ html { background: #f6f6f1 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/bg-content.png"); } body { min-height: 400px; font: 14px/1.428 "Lucida Grande", "Lucida Sans Unicode", Lucida, Arial, Helvetica, sans-serif; margin: 0 auto; color: #333; } /*** @Hidden elements *********/ #popupMask, #pageToc, #bodyHeight, #deki-diffcombined, .article .urlexpansion { display: none; } /*** @Links *********/ :link { color: #369; text-decoration: none; } :visited { color: #69c; text-decoration: none; } :link:hover, :link:focus, :link:active { color: #25a; text-decoration: underline; } :visited:hover, :visited:focus, :visited:active { color: #25a; text-decoration: underline; } a.go:after { content: "\00A0\000BB"; font: 1.3em Georgia, Times, "Times New Roman", serif; } a.link-user, a.userPage, .article a.link-user, .article a.userPage { padding-left: 14px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/user_small.png") 0 50% no-repeat; } a.disabled, a.disabled:link, a.disabled:visited, a.disabled:hover { text-decoration: none; color: #888; cursor: default; } a.new:link, a.new:visited, a.new:hover, a.new:active, a.new:focus { color: #900; } /*** =External Link Styles *********/ .article a.external, .article a[rel~="external"] { padding-right: 16px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/link_external.png") 99% 40% no-repeat; } .article a[href^="mailto:"], .article .link-mailto { padding-right: 16px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/link_mail.png") 99% 40% no-repeat; } .article a[href^="news://"] { padding-right: 18px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/link_news.png") 99% 40% no-repeat; } .article a[href^="ftp://"], .article .link-ftp { padding-right: 18px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/link_download.png") 99% 40% no-repeat; } .article a[href^="irc://"], .article .link-irc { padding-right: 18px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/link_chat.png") 99% 50% no-repeat; } .article a.imagelink { background: none; padding-right: 0; } /*** @Headings *********/ h1, h2, h3, h4, h5, h6 { margin: 0 0 .8em; } h1, .page-title h1 { font-size: 1.857em; } h2 { font-size: 1.428em; } h3 { font-size: 1.142em; } h4, h5, h6 { font-size: 1em; } /*** @Basics *********/ .pageText h1, .pageText h2, .pageText h3, .pageText h4, .pageText h5, .pageText h6 { font-family: Georgia, Times, "Times New Roman", serif; border-bottom: 1px solid #e0e0dc; } .pageText blockquote { padding: 0 25px; border-left: 5px solid #ccc; } .pageText ul { list-style: disc; padding-left: 22px; } .pageText ul ul { list-style: circle; } .pageText ol { padding-left: 22px; } .pageText dt { font-style: normal; font-weight: bold; } .pageText dd { margin-bottom: .5em; padding-left: 15px; } .pageText table { border-color: #ccc; } .pageText th, .pageText td { padding: 1px 3px; } .pageText thead th { font-family: Georgia, Times, "Times New Roman", serif; } .pageText caption { font-weight: bold; } .pageText pre { border: 1px dotted #cbc8b9; background: #f6f6f2; padding: 15px; overflow: auto; font: 100% "Courier New", "Andale Mono", monospace; } .pageText code, .pageText tt { font: 100% "Courier New", "Andale Mono", monospace; font-weight: inherit; } .pageText pre code { font-size: 100%; } .pageText strong code { font-weight: inherit; } .pageText strong tt { font-weight: inherit; } .pageText a code { color: inherit; } .pageText img { max-width: 100%; } /* Increase line-height in wide windows */ .pageText { line-height: inherit; -moz-transition: line-height 0.2s ease-in-out; -webkit-transition: line-height 0.2s ease-in-out; transition: line-height 0.2s ease-in-out; } @media screen and (min-width: 990px) { .pageText { line-height: 1.572; -moz-transition: line-height 0.2s ease-in-out; -webkit-transition: line-height 0.2s ease-in-out; transition: line-height 0.2s ease-in-out; } } .cols-2 { -moz-column-count: 2; -moz-column-gap: 10px; -webkit-column-count: 2; -webkit-column-gap: 10px; column-count: 2; column-gap: 10px; } .cols-3 { -moz-column-count: 3; -moz-column-gap: 10px; -webkit-column-count: 3; -webkit-column-gap: 10px; column-count: 3; column-gap: 10px; } .cols-4 { -moz-column-count: 4; -moz-column-gap: 10px; -webkit-column-count: 4; -webkit-column-gap: 10px; column-count: 4; column-gap: 10px; } .cols-5 { -moz-column-count: 5; -moz-column-gap: 10px; -webkit-column-count: 5; -webkit-column-gap: 10px; column-count: 5; column-gap: 10px; } img.lwrap { background: #fff; padding: 0 20px .75em 0; } img.rwrap { background: #fff; padding: 0 0 .75em 20px; } span.icon img { margin-right: 3px; vertical-align: bottom; } /*** @Forms *********/ input[type=text], input[type=password], input[type=search] { padding: 6px 8px; background: #fff; border: 1px solid #cbc8b9; } input[type=text]:hover, input[type=password]:hover, input[type=search]:hover, input[type=text]:focus, input[type=password]:focus, input[type=search]:focus { border-color: #b6b2a0; } /*** @Buttons *********/ button, input[type=submit], input[type=button] { padding: .25em .75em .2em; display: inline-block; background: #bd5642 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/button-shade.png") 0 .75em repeat-x; color: #fff; font: 200 1.142em/1 "Bebas Neue", "League Gothic", Haettenschweiler, "Arial Narrow", sans-serif; text-decoration: none; text-transform: uppercase; letter-spacing: .5px; border: 0; -moz-border-radius: .2em; -webkit-border-radius: .2em; border-radius: .2em; -moz-box-shadow: 1px 1px 0 rgba(0,0,0,.25); -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,.25); box-shadow: 1px 1px 0 rgba(0,0,0,.25); } button:hover, input[type=submit]:hover, input[type=button]:hover, button:focus, input[type=submit]:focus, input[type=button]:focus { background-color: #ae4935; color: #fff; cursor: pointer; text-decoration: none; } .input-button { font-size: 1.285em; } #pagehistory .input-button { padding: 3px 8px; background-color: #8b807a; } #pagehistory .input-button:hover, #pagehistory .input-button:focus { background-color: #a59890; } .yui-dialog button, .yui-dialog button:hover, .yui-dialog button:focus { background: transparent none; color: inherit; cursor: pointer; } /* @Layout *********/ .wrap { position: relative; width: 96%; min-width: 740px; max-width: 1200px; padding: 0 10px; margin: 0 auto; } .wrap:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } /* clear floats */ #content { min-height: 400px; } #content .wrap { padding-bottom: 1em; position: static; } #content .wrap.sidebar { min-height: 400px; padding-bottom: 3em; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/bg-sidebar.png") 695px 0 no-repeat; } #content-main { width: 100%; float: none; clear: both; padding: 20px 0 0; } .page-content { background: #fff; min-height: 300px; } /* @Header *********/ #masthead { background: #000 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/bg-pinstripe.png") center top repeat-x; border-top: 2px solid #707070; border-bottom: 4px solid #fb9500; color: #ccc; min-height: 70px; -moz-box-shadow: 0 1px 0 rgba(0,0,0,.25); -webkit-box-shadow: 0 1px 0 rgba(0,0,0,.25); box-shadow: 0 1px 0 rgba(0,0,0,.25); } #masthead .wrap { padding-top: 55px; background: #000 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/bg-pinstripe.png") center top repeat-x; } #branding { position: absolute; left: 10px; top: 10px; width: 50%; padding: 2px 0 0 70px; margin: 0 0 10px; } #logo { margin: 0; font: normal 32px/1 "Bebas Neue", "League Gothic", Haettenschweiler, Impact, "Arial Narrow", sans-serif; text-transform: uppercase; color: #fff; letter-spacing: 1px; } #logo a { color: #fff; text-decoration: none; } #logo img { position: absolute; left: -3px; top: -4px; } #moz-tab { position: absolute; right: 10px; top: 0; display: block; width: 118px; height: 49px; text-indent: -999em; overflow: hidden; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/moz-tab.png") 0 0 no-repeat; } .global-notice { position: relative; border: solid #3c0000; border-width: 3px 0; background: #450000 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/bg-check-lt.png"); padding: 10px 20px; margin: 0 0 -1px; font-size: .857em; } .global-notice .wrap { border: 2px solid #e5d5c1; padding: 15px 15px 0; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.75); } .notice { clear: both; position: relative; top: -10px; margin: 10px 0 5px; padding: 10px 15px 0; background: #fcf6d4; border: 1px solid #e5d5c1; box-shadow: 1px 1px 0 rgba(0,0,0,.1); } .notice p, .notice ul { margin-bottom: 10px; } .notice.success { background: #effdfb; border-color: #beede5; } .notice.error { border-color: #e1a696; } div.noscript { text-align: center; margin: 0; padding: .75em 20px; border: solid #e6e1cf; border-width: 3px 0; color: #630; background: #eeecdf; background: rgba(245,235,200,.25); } /*** @Accessbility @Navigation *********/ #nav-access { position: absolute; top: -10em; width: 100%; z-index: 999; } #nav-access a:focus, #nav-access a:active { outline: 0; display: inline-block; padding: 4px 10px; background: #fff; position: absolute; top: 17em; text-decoration: none; box-shadow: 2px 2px 3px rgba(0,0,0,.5); } /*** @Main @Nav *********/ #nav { float: left; margin: 0 0 6px 70px; font: 200 18px/1 "Bebas Neue", "League Gothic", "Arial Narrow", Arial, Helvetica, sans-serif; text-transform: uppercase; letter-spacing: .5px; } #nav:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } #nav a { color: #ccc; } #nav a:hover, #nav a:focus, #nav a:active { color: #fff; outline: 0; } #nav-main { float: right; margin: 0; } #nav-main li { position: relative; display: inline-block; margin: 0 12px -6px 0; } #nav-main a { display: inline-block; height: 18px; padding-bottom: 9px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") center bottom no-repeat; } #nav-main a:hover, #nav-main a:focus, #nav-main a:active { text-decoration: none; padding-bottom: 8px; border-bottom: 1px solid #000; } #nav-main .sub-menu a { display: inline; height: auto; padding: 0; background: none; } #nav-main .sub-menu a:hover, #nav-main .sub-menu a:focus, #nav-main .sub-menu a:active { padding: 0; border: 0; } #nav-main .toggle { position: relative; z-index: 99; padding-right: 12px; margin-right: -12px; } #nav-main .menu { padding-right: 12px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") right -545px no-repeat; } #nav-main .menu:hover { background-position: right -645px; } #nav-main-docs a:hover, #nav-main-docs a:focus, #nav-main-docs a:active { color: #ffae3b; } #nav-main-demos a:hover, #nav-main-demos a:focus, #nav-main-demos a:active { color: #f33; } #nav-main-learning a:hover, #nav-main-learning a:focus, #nav-main-learning a:active { color: #a7df38; } #nav-main-community a:hover, #nav-main-community a:focus, #nav-main-community a:active { color: #0cf; } #nav-main .menu { padding: 0 12px 0 0; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") 100% -545px no-repeat; } #nav-main .menu:hover { background-position: 100% -595px; } #nav-main #nav-main-docs:hover { background-position: 100% -645px; } #nav-main #nav-main-community:hover { background-position: 100% -1145px; } #nav-main .menu .sub-menu { position: absolute; z-index: 98; left: -999em; top: 27px; background: #000; list-style: none; width: 80px; font-size: 1em; padding: 10px 6px 4px; border: 4px solid #f8d575; text-align: center; -moz-box-shadow: 0 0 3px rgba(0,0,0,.5); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.5); box-shadow: 0 0 3px rgba(0,0,0,.5); } #nav-main .menu .sub-menu li { display: block; float: none; width: 100%; margin: 0 0 .35em; } .hasJS #nav-main .menu .sub-menu, #nav-main .menu:hover .sub-menu { left: 50%; margin-left: -50px; } .hasJS #nav-main .menu .sub-menu { display: none; } .section-docs #nav-main-docs { background-position: right -645px; } .section-docs #nav-main-docs .docs { padding-bottom: 9px; border: 0; color: #fb9500; background-position: center -130px; } .section-demos #nav-main-demos .demos { padding-bottom: 9px; border: 0; color: #ed2024; background-position: center -430px; } .section-learning #nav-main-learning .learning { padding-bottom: 9px; border: 0; color: #8dc434; background-position: center -230px; } .section-community #nav-main-community { background-position: right -1145px; } .section-community #nav-main-community .community { padding-bottom: 9px; border: 0; color: #00b6f0; background-position: center -330px; } .section-docs #nav-main-docs .docs:hover, .section-docs #nav-main-docs .docs:focus, .section-docs #nav-main-docs .docs:active { color: #ffae3b; background-position: center -180px; border-bottom: 1px solid #000; padding-bottom: 8px; } .section-demos #nav-main-demos .demos:hover, .section-demos #nav-main-demos .demos:focus, .section-demos #nav-main-demos .demos:active { color: #f33; background-position: center -480px; border-bottom: 1px solid #000; padding-bottom: 8px; } .section-learning #nav-main-learning .learning:hover, .section-learning #nav-main-learning .learning:focus, .section-learning #nav-main-learning .learning:active { color: #a7df38; background-position: center -280px; border-bottom: 1px solid #000; padding-bottom: 8px; } .section-community #nav-main-community .community:hover, .section-community #nav-main-community .community:focus, .section-community #nav-main-community .community:active { color: #0cf; background-position: center -380px; border-bottom: 1px solid #000; padding-bottom: 8px; } .section-web #nav-main-topics, .section-mobile #nav-main-topics, .section-addons #nav-main-topics, .section-mozilla #nav-main-topics { background-position: 100% -595px; } .section-web #nav-main-topics .toggle, .section-mobile #nav-main-topics .toggle, .section-addons #nav-main-topics .toggle, .section-mozilla #nav-main-topics .toggle { color: #f8d575; } #nav-main .toggle { position: relative; z-index: 999; padding-right: 12px; margin: 0 -12px 0 0; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") no-repeat; } #nav-main .toggle.open { height: 24px; padding-bottom: 9px; margin-bottom: -9px; border: 0; } #nav-main #nav-main-topics .open { color: #f8d575; background-position: center -30px; } #nav-main #nav-main-docs .open { color: #ffae3b; background-position: center -80px; } #nav-main #nav-main-community .open { color: #00b6f0; background-position: center -1080px; } #nav-main-topics a:hover, #nav-main-topics a:focus, #nav-main-topics a:active { color: #f8d575; } #nav-main-community a:hover, #nav-main-community a:focus, #nav-main-community a:active { color: #0cf; } #nav #nav-sub-community { border-color: #00b6f0; } /*** @Shortcuts to @Docs *********/ #nav-main #nav-sub-docs { width: 420px; padding: 10px 15px; font-size: .857em; border-color: #fb9500; } .hasJS #nav-main #nav-sub-docs, #nav-main .menu:hover #nav-sub-docs { margin-left: -150px; } #nav-main #nav-sub-docs ul { list-style: none; margin: 0; overflow: hidden; font: 11px "Lucida Grande", "Lucida Sans Unicode", Lucida, Arial, Helvetica, sans-serif; text-transform: none; letter-spacing: normal; } #nav-main #nav-sub-docs li { width: 24.9%; float: left; padding: .5em 0; margin: 0; text-align: center; } #nav-main #nav-sub-docs li li { width: 100%; float: none; padding: 0; margin: 0; } #nav-main #nav-sub-docs p { border-top: 1px solid #666; clear: both; padding: .75em 0 0; margin: .5em 0; text-align: right; font: .785em "Lucida Grande", "Lucida Sans Unicode", Lucida, Arial, Helvetica, sans-serif; text-transform: none; letter-spacing: normal; } #nav-main #nav-sub-docs a { color: #ccc; height: auto; display: block; padding: .4em 0; border: 0; } #nav-main #nav-sub-docs a:hover, #nav-sub-docs a:focus, #nav-sub-docs a:active { border: 0; padding: .4em 0; color: #fb9500; text-decoration: underline; } /*** @User @Nav *********/ .user-state .menu { position: relative; } .user-state a.toggle { padding-right: 15px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/menu-arrow-w.png") 98% 50% no-repeat; } .user-state .sub-menu { position: absolute; left: -999em; margin-top: -2px; z-index: 9999; width: 140px; background: #000; border: 1px solid #030303; padding: 0 0 4px; -moz-box-shadow: 2px 2px 0 rgba(0,0,0,.2); -webkit-box-shadow: 2px 2px 0 rgba(0,0,0,.2); box-shadow: 2px 2px 0 rgba(0,0,0,.2); } .user-state .superfish .sub-menu { left: auto; right: 0; z-index: 9999; } .user-state .sub-menu li { border: 0; display: block; width: 140px; float: none; text-align: left; margin: 0; padding: 0; } .user-state .sub-menu a { display: block; padding: 4px 12px; background-image: none; } .user-state .menu:hover .sub-menu, .user-state .sfhover .sub-menu, .user-state a:focus + ul { left: auto; right: 0; } /*** @User status *********/ .user-state { width: 235px; float: right; text-align: right; color: #666; margin: 0; } .user-state li { display: inline; } .user-state li + li { padding-left: 10px; margin-left: 8px; border-left: 1px solid #666; } .user-state a { color: #ccc; } .user-state a:hover, .user-state a:focus, .user-state a:active { color: #fff; } .user-state form { display: inline; } #masthead .user-state { font-size: .786em; margin-bottom: 0; position: absolute; right: 145px; top: 12px; } #site-info .user-state { margin-bottom: .5em; } /*** @BrowserID *********/ a.browserid-signin:link, a.browserid-signin:visited { padding: 1px 10px 1px 28px; color: #fff !important; background: #555 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/btn-browserid.png") -1px 50% no-repeat; border-radius: 3px; border: 1px outset rgba(50,50,50,.5); } a.browserid-signin:hover, a.browserid-signin:focus, a.browserid-link:active { background-color: #666; } .user-signin a.browserid-signin { position: relative; z-index: 100; } .user-state .browserid-info { position: absolute; z-index: 99; left: -999em; top: 0; margin-top: 25px; width: 300px; color: #ccc; border: 4px solid #333; padding: 8px 14px; text-align: left; background: #000; -moz-box-shadow: 0 0 3px rgba(0,0,0,.5); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.5); box-shadow: 0 0 3px rgba(0,0,0,.5); } .browserid-info h3:after { content: "^"; width: 100%; display: block; text-indent: -999em; overflow: hidden; padding: 0 4px; height: 25px; margin: 0 -4px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") 280px -1186px no-repeat; position: absolute; top: -25px; right: 0; } .browserid-info p { margin: 0 0 .75em; } .user-state .browserid-info a { color: #fff !important; display: inline; padding: 0; } .user-state .browserid-info a.browserid-signin { display: inline-block; font-size: 1.124em; font-weight: bold; padding: 2px 12px 2px 30px; margin-top: .5em; } .hasJS .user-state .menu .browserid-info, .user-state .menu:hover .browserid-info { right: -14px; left: auto; margin-left: 0; } .hasJS .user-state .menu .browserid-info { display: none; } .footer .user-state .browserid-info { top: auto; bottom: 0; margin: 0 0 25px; } .footer .browserid-info h3:after { top: auto; bottom: -25px; background: transparent none; } /*** @Tools @Nav *********/ #nav-toolbar { font-size: .785em; text-shadow: 1px 1px 0 rgba(255,255,255,.25); padding: 0; border-top: 1px solid #cbc8b9; border-bottom: 1px solid #f8f8f6; background: #e4e4d9; background: rgba(198,198,175,.35); } #tool-menus { width: 300px; float: right; } #tool-menus ul li.menu { float: right; padding: 0; margin: 0; position: relative; } #tool-menus li a { display: block; padding: .6em 20px .7em 8px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/menu-arrow.png") 92% 0 no-repeat; } #tool-menus li a:hover, #tool-menus li a:focus, #tool-menus li a:active, #tool-menus li.sfhover > a { background-color: #369; background-position: 92% -100px; color: #fff; text-decoration: none; text-shadow: 1px 1px 0 rgba(0,0,0,.25); } #tool-menus li li a, #tool-menus li li strong { display: block; padding: .5em 15px; background: transparent none; } #tool-menus li li strong { background-color: #f5f5f1; } #tools .menu ul { position: absolute; left: -999em; z-index: 9999; width: 180px; background: #fff; border: 1px solid #c6c6c2; -moz-box-shadow: 2px 2px 0 rgba(170,160,130,.2); -webkit-box-shadow: 2px 2px 0 rgba(170,160,130,.2); box-shadow: 2px 2px 0 rgba(170,160,130,.2); } #tools.superfish .menu ul { left: auto; right: 0; z-index: 9999; } #tools .menu ul li { width: 180px; margin: 0; font-size: 1.12em; } #tools .menu:hover ul, #tool-menus ul .sfhover ul { left: auto; right: 0; } #nav-toolbar a:link, #nav-toolbar a:visited { color: #6d6d67; } #nav-toolbar a:hover, #nav-toolbar a:focus, #nav-toolbar a:active { color: #25a; } #nav-toolbar a.disabled { color: #aaa; } #nav-toolbar a.disabled:hover, #nav-toolbar a.disabled:focus, #nav-toolbar a.disabled:active { color: #aaa; background: transparent; cursor: default; text-shadow: none; } .sf-js-enabled .toggle:focus { outline: 0; } /*** @Breadcrumbs *********/ #nav-toolbar .crumbs { float: left; } #nav-toolbar .crumbs ol { margin: 0; padding: .6em 0 .7em; list-style: none; } #nav-toolbar .crumbs li { display: inline; padding-left: 13px; margin-left: 6px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") -15px -698px no-repeat; } #nav-toolbar .crumbs li.first, #nav-toolbar .crumbs li.second { display:none; } #nav-toolbar .crumbs li.first.last { display: inline; } #nav-toolbar .crumbs li.crumb-one { padding-left: 0; margin-left: 0; background: none; } /*** @Search *********/ #site-search { width: 280px; float: right; text-align: left; padding-left: 0; margin: -8px 135px 0 0; position: relative; } #site-search p { margin: 0; } #site-search #q { width: 160px; padding: 3px 4px 3px 28px; margin: 0 0 0 4px; float: right; background: #555; background: rgba(80,80,80,.9) url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/search-icons.png") 6px -96px no-repeat; border: 1px solid #666; color: #aaa; font-size: .857em; -webkit-appearance: textfield; appearance: textfield; } #site-search #q:hover, #site-search #q:focus { border-color: #9c0d10; background-color: #fff; color: #333; } #site-search button { font-size: 12px; width: 60px; position: absolute; right: -70px; } #site-search-gg { width: 60px; height: 28px; font-size: .642em; float: right; text-align: right; position: relative; } #site-search-gg * { margin: 0; padding: 0; } #site-search-gg img { height: 12px; display: block; position: absolute; top: 13px; right: 0; } #site-search-gg .gsc-branding-text { width: 60px; display: block; color: #666; position: absolute; top: 0; } @media screen and (max-width: 920px) { #site-search { width: 190px; -moz-transition: width 0.2s ease-out; -webkit-transition: width 0.2s ease-out; transition: width 0.2s ease-out; } #site-search #q { width: 90px; -moz-transition: width 0.2s ease-out; -webkit-transition: width 0.2s ease-out; transition: width 0.2s ease-out; } #logo { font-size: 30px; -moz-transition: font-size 0.2s ease-out; -webkit-transition: font-size 0.2s ease-out; transition: font-size 0.2s ease-out; } #nav { font-size: 16px; -moz-transition: font-size 0.2s ease-out; -webkit-transition: font-size 0.2s ease-out; transition: font-size 0.2s ease-out; } } /* @Footer *********/ .last-mod { clear: both; text-align: right; font-size: .785em; } #footbar { padding: 1.3em 0 0; background: #450000; border-bottom: 6px solid #3c0000; color: #f5f5f0; font: italic .928em/1.1 Georgia, Times, "Times New Roman", serif; text-align: right; } #footbar .wrap { background: #450000; } #footbar p { text-align: right; margin: 0 0 1em; } #footbar a:link, #footbar a:visited, .footer a:link, .footer a:visited { color: #eb9f81; } #footbar a:hover, #footbar a:focus, #footbar a:active, .footer a:hover, .footer a:focus, .footer a:active { color: #fff; } #site-info { background: #000; padding: 30px 0 50px; border-top: 1px solid #5d0900; color: #f1f1ec; font-size: .785em; } #site-info .wrap { background: #000; } #site-info #legal { position: relative; float: left; padding-left: 55px; } #site-info #legal img { position: absolute; left: -3px; top: -10px; } #site-info p { margin: 0 0 .5em; } /* @Boxes *********/ .boxed { background: #fff; padding: 18px; margin: 0 4px 26px 0; border: 1px solid #ecece7; -moz-box-shadow: 2px 2px 0 rgba(170,160,130,.5), 4px 4px 0 rgba(200,190,165,.5); -webkit-box-shadow: 2px 2px 0 rgba(170,160,130,.5), 4px 4px 0 rgba(200,190,165,.5); box-shadow: 2px 2px 0 rgba(170,160,130,.5), 4px 4px 0 rgba(200,190,165,.5); } .boxed:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } .boxed .head { margin: -18px -18px 1.4em; padding: 14px 18px 14px 75px; min-height: 30px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons-sections.png") no-repeat; } .boxed .head.section-web { background-position: 0 0; } .boxed .head.section-mobile { background-position: 0 -200px; } .boxed .head.section-addons { background-position: 0 -400px; } .boxed .head.section-apps { background-position: 0 -600px; } .boxed .head h2, .boxed .head h3 { margin-bottom: 0; color: #000; font: 200 1.857em/1.2 "Bebas Neue", "League Gothic", Haettenschweiler, sans-serif; text-transform: uppercase; letter-spacing: .5px; } .boxed .head p { margin: 0; font: bold italic .857em/1.1 Georgia, Times, "Times New Roman", serif; } .boxed .subhead { margin: 0 0 1.4em; } .boxed .subhead h2, .boxed .subhead h3 { margin-bottom: 0; color: #000; font: 200 1.714em/1.2 "Bebas Neue", "League Gothic", Haettenschweiler, sans-serif; text-transform: uppercase; letter-spacing: .5px; } .boxed .subhead p { font: italic .857em/1.1 Georgia, Times, "Times New Roman", serif; } /* @Search *********/ #doc-search { border: 1px solid #cbc8b9; background: rgba(198,198,175,.25); padding: 4px; margin-bottom: 1em; font-size: .928em; } #doc-search p { margin: 0; } #doc-search #q-docs { width: 590px; margin-right: 8px; } #doc-search #doc-filter { width: 140px; margin-right: 8px; } /* @Search @Results *********/ #google-branding { font-size: .785em; float: right; margin-top: -3.75em; opacity: .3; } #google-branding .gsc-branding-text { vertical-align: top; padding-right: 2px; } #search-results .gs-result { margin: 0 0 1.2em; padding: 0 2px 1.2em; border-bottom: 1px dotted #d8d4ca; } #search-results .gs-title { font-size: 1em; font-weight: bold; margin: 0 0 .25em; } #search-results .gs-snippet { font-size: .857em; margin: 0 0 .25em; } #search-results .gs-visibleUrl { font-size: .785em; display: inline; margin-right: 10px; color: #aaa; } #search-results .gs-visibleUrl-short { font-weight: bold; } #search-results div.gs-watermark { display: none; } /* @Custom styles *********/ p.footnote { font-size: 90%; font-style: italic; color: #716d65; } div.callout-box { float: right; margin: 0 0 .5em 15px; border: 1px solid #eee; padding: 10px; width: 200px; background: #fafafa; text-align: center; } div.note { margin-bottom: 1.286em; border: solid #dddaaa; border-width: 1px 0; padding: .75em 15px; background: #faf9e2; color: #5d5636; } div.tip { margin-bottom: 1.286em; border: 1px solid #e1f5f0; border-width: 1px 0; padding: .75em 15px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/tip-bg.png") repeat-x; color: #6d675f; } div.note p, div.tip p { margin-bottom: .75em; } /* @Page @Title and @Buttons *********/ .page-title { position: relative; } .page-title:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } /* clear floats */ .page-title h1 { float: left; margin-left: 16px; width: 65%; } .page-title h1.talk span { font-size: .538em; font-weight: normal; color: #6d6d67; } .page-title .pageback { font-size: .857em; margin-top: -1.6em; float: left; width: 75%; } .page-title .page-moved { float: left; width: 65%; clear: both; margin: -1.5em 0 1em 16px; font-size: .785em; } #page-buttons { width: 30%; margin: 0; position: absolute; right: 25px; top: 0; } #page-buttons li { float: right; margin: 0 0 2px 10px; padding: 0; background: none; } #page-buttons a { display: inline-block; padding: 8px 10px 6px 32px; color: #333; font: 200 15px/1 "Bebas Neue", "League Gothic", Haettenschweiler, sans-serif; text-transform: uppercase; letter-spacing: .5px; border: 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 1px 0 rgba(0,0,0,.25); -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,.25); box-shadow: 1px 1px 0 rgba(0,0,0,.25); } #page-buttons .page-edit a { background: #a5d9f3 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/button-edit.png") 0 50% repeat-x; } #page-buttons .page-edit a:hover, #page-buttons .page-edit a:focus, #page-buttons .page-edit a:active { background-color: #ade4ff; text-decoration: none; } #page-buttons .page-edit a.disabled { cursor: pointer; opacity: .75; background-color: #c8e6ed; } #page-buttons .page-watch a { padding-left: 35px; background: #f2d29e url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/button-watch.png") 0 50% repeat-x; } #page-buttons .page-watch a:hover, #page-buttons .page-watch a:focus, #page-buttons .page-watch a:active { background-color: #f8daa9; text-decoration: none; } #page-buttons .page-watch a.disabled { cursor: pointer; opacity: .75; background-color: #f0e4c7; } .page-content .talkpage { font-size: .857em; padding: .25em 15px; } /* @Messages *********/ #sessionMsg { display: none; } #sessionMsg.successmsg, #sessionMsg.errormsg { display: block; margin-bottom: 1.286em; } #sessionMsg.successmsg div.inner { border: 2px solid #aaa; padding: 10px 10px 10px 50px; background: #eefdf2 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/sysaccept.png") 10px 2px no-repeat; } #sessionMsg.errormsg div.inner { border: 2px solid #aaa; padding: 10px 10px 10px 50px; background: #f8f8f0 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/sysalert.png") 10px 2px no-repeat; } #sessionMsg ul { margin: 0; list-style: none; } #sessionMsg ul li { padding: 0; background: none; } /* @TOC @Table of contents *********/ #article-nav { float: right; padding: 0 0 1em 20px; background: #fff; width: 230px; position: relative; z-index: 1; } .page-toc { background: #e4edf7; padding: 16px 18px; margin: 0 0 5px; border: 1px solid #dfe8f2; font-size: .857em; } .page-toc h2 { margin: 0 0 .75em; font: 200 20px/1.2 "Bebas Neue", "League Gothic", Haettenschweiler, sans-serif; text-transform: uppercase; letter-spacing: .5px; } .page-toc ol { margin: 0; } .page-toc ol li { margin-bottom: .25em; } .page-toc ol li span { display: none; } /* hide numbers */ .page-toc ol li ol { margin-top: .5em; } .page-toc ol li ol li { margin-left: 0; } #article-nav .page-anchors { background: #f1f6fb; margin: 0 0 5px; padding: 6px 18px; border: 1px solid #edf2f7; font-size: .785em; font-style: italic; text-transform: uppercase; } #article-nav .page-anchors li { display: inline; padding: 0; margin-right: 12px; background: none; } #article-nav .page-anchors a { padding-left: 16px; } #article-nav .anchor-tags a { background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/tag-tiny.png") 0 50% no-repeat; } #article-nav .anchor-files a { background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/attach-tiny.png") 0 50% no-repeat; } /* @Page alerts **********/ #deki-page-alerts { float: none; clear: both; font-size: .857em; padding: 6px 6px 6px 8px; background-color: #f6f6f6; border: 1px solid #f3f3f3; margin-bottom: 5px; } #deki-page-alerts span.status { font-weight: bold; } #deki-page-alerts div.toggle { padding: 0; background-color: transparent; border: 0; margin: 0; } #deki-page-alerts form.options { padding: 8px; } #deki-page-alerts form.options li.off { background-color: #eee; } /* @IRC @channels *********/ div.suggestchannels { font-size: .857em; } div.suggestchannels > div { overflow: hidden; padding: 6px 6px 6px 8px; background-color: #f6f6f6; border: 1px solid #f3f3f3; margin-bottom: 5px; } div.suggestchannels ul { list-style: none; } div.suggestchannels li { float: left; width: 50%; margin: 0 0 .5em; } /* @Meta *********/ .article .page-meta { clear: both; margin-top: 30px; } .page-meta section { position: relative; overflow: hidden; background: #f5f5f1; padding: 15px 20px; margin: 0 0 20px; } .page-meta h2 { margin: 0 20px 0 0; color: #666; font: 200 20px/1.1 "Bebas Neue", "League Gothic", Haettenschweiler, "Arial Narrow", sans-serif; text-transform: uppercase; letter-spacing: .5px; } .page-meta p.add { width: 190px; position: absolute; right: 20px; top: 12px; text-align: right; margin: 0; } .page-meta p.add a, #deki-page-tags-toggleview { display: inline-block; padding: 8px 10px 6px 32px; background-color: #a5d9f3; color: #333; font: 200 15px/1 "Bebas Neue", "League Gothic", Haettenschweiler, "Arial Narrow", sans-serif; text-transform: uppercase; letter-spacing: .5px; border: 0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 1px 0 rgba(0,0,0,.25); -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,.25); box-shadow: 1px 1px 0 rgba(0,0,0,.25); } .page-meta p.add a:hover, .page-meta p.add a:focus, .page-meta p.add a:active { background-color: #ade4ff; text-decoration: none; } .page-meta p.none { display: inline; } .page-meta p.add a.disabled { opacity: .75; } /*** @Tags *********/ #page-tags h2 { float: left; } #page-tags .add a, #deki-page-tags-toggleview { background: #a5d9f3 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/button-edit.png") 0 50% repeat-x; } #page-tags .add a:hover, #page-tags .add a:focus, #page-tags .add a:active, #page-tags #deki-page-tags-toggleview:hover, #page-tags #deki-page-tags-toggleview:focus, #page-tags #deki-page-tags-toggleview:active { background-color: #ade4ff; text-decoration: none; } #page-tags #deki-page-tags-toggleview { position: absolute; right: 20px; top: 12px; } #page-tags .add a.disabled, #page-tags #deki-page-tags-toggleview.disabled { opacity: .75; background-color: #c8e6ed; } #page-tags ul.tags { margin: 0; list-style: none; } #page-tags ul.tags li { padding: 0; background: none; display: inline; margin-right: 8px; } #page-tags .pageTagList div.item { padding: 0; } #page-tags .taglist a, #page-tags ul.tags a { display: inline-block; padding: 2px 8px; margin-bottom: .5em; background: #f5f5f1 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/light-shade.png") 0 .9em repeat-x; color: #333; border: 1px solid #91918e; } #page-tags .taglist a:hover, #page-tags .taglist a:focus, #page-tags .taglist a:active, #page-tags ul.tags a:hover, #page-tags ul.tags a:focus, #page-tags ul.tags a:active { background-color: #fff; text-decoration: none; border-color: #aaa; } #page-tags #deki-page-tags .tagContainer { white-space: normal; } #page-tags #deki-page-tags .tagButtons { padding-left: 10px; } #page-tags #deki-page-tags .tagData { padding-right: 30px; } #page-tags #deki-page-tags { float: left; } #page-tags #deki-page-tags table { margin: 0; width: 550px; } #page-tags #deki-page-tags .tagAdd { float: right; padding: .25em 10px; background: #e1e1e1 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/button-shade.png") 0 .9em repeat-x; color: #333; font: 200 1em/1.2 "Bebas Neue", "League Gothic", Haettenschweiler, sans-serif; text-transform: uppercase; letter-spacing: .5px; border: 0; -moz-border-radius: .25em; -webkit-border-radius: .25em; border-radius: .25em; } #page-tags #deki-page-tags .col1 { width: 100px; padding-top: .25em; } #page-tags #deki-page-tags .tag-edit { border: 1px solid #e0e0dc; background: rgba(255,255,255,.5); padding: 10px; } #page-tags #deki-page-tags .tag-edit .input-button { font-size: 1em; background-color: #e1e1e1; color: #333; } #deki-page-tags-edit ul.tags a { background: transparent none; border: 0; padding: 0; color: #369; } #deki-page-tags-edit ul.tags a:hover, #deki-page-tags-edit ul.tags a:focus, #deki-page-tags-edit ul.tags a:active { color: #25a; text-decoration: underline; } #deki-page-tags-edit ul.tags a.tag-delete { margin-right: 5px; width: 20px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/delete.png") 50% 5px no-repeat; } #deki-page-tags-edit ul.tags a.tag-delete:hover, #deki-page-tags-edit ul.tags a.tag-delete:focus, #deki-page-tags-edit ul.tags a.tag-delete:active { background-position: 50% -45px; } /*** @Attachments / @Files ********/ #page-files #pageFiles, #page-files #pageGallery { clear: both; margin: 0; } #page-files #sessionMsg { margin-top: 1em; } #page-files .filescontent td, #page-files .filescontent th { background: transparent; } #page-files .add a { background: #a5d9f3 url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/button-attach.png") 0 50% repeat-x; } #page-files .add a:hover, #page-files .add a:focus, #page-files .add a:active { background-color: #ade4ff; text-decoration: none; } #page-files .add a.disabled { opacity: .75; background-color: #c8e6ed; } #page-files .nofiles { display: none; } #deki-image-gallery-lite .empty { display: none; } #attachTable { margin-top: 1em; } #attachTable table { border-collapse: collapse; border: 1px solid #e0e0dc; border-bottom: 0; } #attachTable table th { border-bottom: 1px solid #e0e0dc; padding: 2px; font-size: .857em; text-align: left; font-weight: normal; } #attachTable table th.col1 { padding-left: 36px; } #attachTable table td { vertical-align: top; border-bottom: 1px solid #e0e0dc; padding: 6px 2px; } #attachTable table td.col2 { vertical-align: top; } #attachTable a.file-preview { margin-left: 15px; } #attachTable a.file-preview:before { content: "["; } #attachTable a.file-preview:after { content: "]"; } #attachTable a.actionmenu { padding: 0 15px 0 8px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/downarrow.png") 98% 55% no-repeat; color: #333; } #attachTable .desctext { font-size: .857em; } #attachTable ul.deki-file-menu li { padding: 0; background: none; } .deki-file-menu { font-size: .857em; } a.deki-file-revisions:hover, a.deki-file-revisions:focus, a.deki-file-revisions:active { text-decoration: none; } /*** @Attached @Images *********/ #pageGallery { float: left; clear: both; margin-bottom: 1em; width: 100%; } #pageGalleryWrap .preControls { float: left; clear: both; width: 100%; margin: 1em 0 1.7em; } #pageGalleryWrap .preControls div.offset form { margin-left: 20px; } #pageGalleryWrap .navigation, #pageGalleryWrap .disabled { color: #888; } #pageGalleryWrap #pageGallery div.galleryCell { position: relative; margin-bottom: .75em; } #pageGalleryWrap a img.image { border: 1px solid; padding: 2px; } #pageGalleryWrap a:hover img.image { border-color: #369; } #pageGalleryWrap .desctext { margin: .5em 0 0; font: 11px Verdana, Tahoma, sans-serif; } #pageGalleryWrap .desctext span.desctext { display: block; } #pageGalleryWrap a.actionmenu { border-left: 1px solid #ccc; padding: 0 15px 0 8px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/downarrow.png") 98% 55% no-repeat; color: #333; } /* @Comments *********/ #comments div.comments, #comments div.commentForm { padding: 0; } #comments div.comments { margin-bottom: 1em; } #comments div.commentMore { clear: both; float: none; padding: 6px 0; font-size: .785em; } #comments div.comment { position: relative; clear: both; border-bottom: 1px solid #ebeae7; padding: 20px 50px; } #comments div.comment.comment-deleted { padding: 10px 50px; } #comments div#comment1 { border-top: 1px solid #ebeae7; } #comments div.commentNum { position: absolute; left: 5px; top: 13px; font-size: 150%; line-height: 1.2; } #comments div.commentNum a { padding: 0; color: #b4afa8; } #comments div.commentMetaData { margin-bottom: .5em; font-size: .785em; } #comments div.commentText { float: none; padding: 0; width: auto; } #comments div.commentPosted { margin: 1em 0 0; font-size: .785em; color: #888; } #comments div.commentPosted em { font-style: normal; } #comments span.commentUpdated { margin-left: 1em; font-size: .785em; color: #888; } #comments span.commentUpdated:before { content: "["; } #comments span.commentUpdated:after { content: "]"; } #comments div.commentActions { position: absolute; right: 15px; bottom: 18px; font-size: .857em; } #comments div.commentActions a { margin-right: 15px; padding: 2px 0 2px 20px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/comment_edit.png") no-repeat; color: #444; } #comments div.commentActions form.commentDelete { display: inline; } #comments div.commentActions form.commentDelete input { border: 0; padding: 2px 0 2px 20px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/comment_delete.png") no-repeat; color: #444; font-family: inherit; text-transform: none; cursor: pointer; } #comments div.commentActions form.commentDelete input:hover { color: #b00; } #comments .commentForm .commentText { width: 100%; height: 7em; font-family: inherit; font-size: inherit; color: inherit; } #comments .commentForm .commentHeader { margin: 1em 0 .25em; color: #666; font: 200 20px/1.1 "Bebas Neue", "League Gothic", Haettenschweiler, sans-serif; text-transform: uppercase; letter-spacing: .5px; } #comments .commentForm .commentSubmit { margin: .5em 0 0; } /* @Menus (misc dropdowns) *********/ div.dmenu-body { border: 1px solid #eee; border-right: 2px solid #ccc; border-bottom: 2px solid #ccc; padding: 10px 15px 0; background: #fff; } div.dmenu-body ul { margin-bottom: 0; list-style: none; font: 11px Verdana, Tahoma, sans-serif; } div.dmenu-body li { margin-bottom: 8px; } div.dmenu-body a { padding: 2px 0; color: #444; } div.dmenu-body a:link, div.dmenu-body a:visited, div.dmenu-body a:hover, div.dmenu-body a:active { color: #444; } div.dmenu-body span.icon { position: relative; bottom: -2px; padding-right: 5px; background-color: #fff; } div.menu a.disabled, div.dmenu-body a.disabled { color: #888; cursor: default; background-position: 0 -48px; } div.menu a.disabled:hover, div.dmenu-body a.disabled:hover { text-decoration: none; } #menuFiller { width: 160px; margin-left: -94px; display: block; } #menuFiller div.dmenu-body { background: #fff; border: 1px solid #c6c6c2; -moz-box-shadow: 2px 2px 0 rgba(170,160,130,.2); -webkit-box-shadow: 2px 2px 0 rgba(170,160,130,.2); box-shadow: 2px 2px 0 rgba(170,160,130,.2); } #menuFiller div.dmenu-body ul { font-family: inherit; font-size: .785em; } /* @Modal dialogs *********/ .mask { position: fixed; } .TB_overlayBG, .TB_overlayMacFFBGHack { background-color: #000; filter: alpha(opacity=25); -moz-opacity: 0.25; opacity: 0.25; } #TB_window, #mt-dialog { font: .875em/1.286 "Lucida Grande", "Lucida Sans Unicode", Lucida, Arial, Helvetica, sans-serif; } #TB_window a:link, #TB_window a:visited, #mt-dialog a:link, #mt-dialog a:visited { color: #369; } #MTMessageStyle { width: 950px; margin: 0 auto; color: #333; } /* @Editor *********/ .article #eareaParent table { margin: 0; } #quicksavewait { display: none; } div.quicksavedone { display: none; width: 89px; height: 9px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/common/icons/anim-save.gif") no-repeat; } .saveMsgSuccess { display: none; z-index: 999; border: 1px solid #aaa; padding: 4px; width: 350px; background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/sysaccept.png") no-repeat center left; } #topic div.saveMsgSuccess p { margin: 0; padding: 4px 4px 4px 40px; font-size: 14px; } .TB_SideBorder { background-color: #ccc; } .TB_ToolbarSet { border-top-color: #ccc; border-bottom-color: #ccc; } /* @Tables on Admin and Special pages *********/ table.table { margin: .5em 0 1em; border-collapse: collapse; border: 1px solid #e0e0dc; border-bottom: 0; width: 100%; font-size: .857em; font-family: inherit; } table.table th { border-bottom: 1px solid #e0e0dc; padding: 2px 6px; text-align: left; font-size: 10px; font-weight: normal; } table.table td { border-bottom: 1px solid #e0e0dc; padding: 6px; } table.table tr.show-no { display: none; } table.table .bg2 { background-color: #f7f7f5; } table.table tr.group td.col2 { padding-left: 25px; } table.table .autocomment a { margin-right: 10px; } table.table a.sort-desc { padding-right: 15px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/downarrow.png") 100% 55% no-repeat; } table.table a.sort-asc { padding-right: 15px; background: transparent url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/icons/uparrow.png") 100% 55% no-repeat; } /* @Admin pages *********/ #pageTypeAdmin form table td { padding: 6px; } #pageTypeAdmin .tablemenu input { margin-left: 6px; } form#addusers td.usertip, form#addservices td.usertip, form#editservices td.usertip { border: 1px solid #ebeae7; background: #f3f3f3; } .PageDW-Admin #pageTypeAdmin ul { margin: 0 auto 2em; width: 80%; overflow: auto; list-style: none; } .PageDW-Admin #pageTypeAdmin ul li { position: relative; float: left; margin: 0 2% 10px 0; border: 1px solid #ebeae7; padding: 3em 10px 10px; width: 28%; height: 10em; overflow: hidden; font: 11px Verdana, Tahoma, sans-serif; } .PageDW-Admin #pageTypeAdmin ul li:hover { border-color: #d4e7ed; background-color: #eefaff; } .PageDW-Admin #pageTypeAdmin ul li strong { font: 16px Georgia, serif; } .PageDW-Admin #pageTypeAdmin ul li a { display: block; position: absolute; margin: -2em -10px -10px; padding: 10px; width: 100%; height: 9em; } .PageDW-AdminStyles textarea { width: 80%; } /* @Special pages *********/ .PageDW-SpecialListRss ul, .PageDW-SpecialListRss ol { list-style: none; } .PageDW-SpecialListRss a.iconitext span.icon { margin-bottom: -2px; } #preferences ul { list-style: none; } #preferences fieldset legend { display: none; } #preferences div.row { clear: both; margin-bottom: .5em; } #preferences span.label { display: block; margin-bottom: .25em; } #pageTypeSpecial #logindivid label { display: block; margin-bottom: .25em; } #pageTypeSpecial #logindivid td { padding-bottom: .5em; padding-right: 15px; vertical-align: bottom; } .deki-page-subnav, .PageDW-SpecialSitemap form { background: #ebebe4; background: rgba(198,198,175,.1); padding: 4px; margin-bottom: 1em; font-size: .857em; overflow: hidden; } .deki-page-subnav ul, .deki-page-subnav ul li { display: inline; padding: 0; } .deki-user-autocomplete { background: #ebebe4; background: rgba(198,198,175,.1); padding: 4px; margin-bottom: 1em; font-size: .857em; } .deki-user-autocomplete table, .deki-user-autocomplete table td { border: 0; margin: 0; } .deki-user-autocomplete #autoComplete { margin: 0 8px; } .deki-rclanguages { float:right; } .deki-rc-feeds { float: none; padding: 3px; } .deki-feedlist a { margin-left: 10px; } .deki-pagination, .pagination { padding: 5px 0; overflow: hidden; font-size: .857em; } .deki-pagination div, .pagination span { float: left; } .deki-pagination div.prev, .pagination .prev, .deki-pagination div.next, .pagination .next { width: 20%; } .deki-pagination div.info { width: 56%; text-align: center; float: none; padding: 0 22%; margin: 0 auto -1.875em; } .deki-pagination .next, .pagination .next { text-align: right; float: right !important; } .deki-pagination .prev a:before, .pagination .prev a:before { content: "\00AB\00A0"; font-size: 1.1em; } /* laquo space */ .deki-pagination .next a:after, .pagination .next a:after { content: "\00A0\00BB"; font-size: 1.1em; } /* space raquo */ .deki-pagination div.prev, .deki-pagination div.next { padding: 0 !important; margin: 0 !important; } .deki-pagination div.prev a.prev, .deki-pagination div.next a.next { color: #369; padding: 0 !important; background: none !important; } .PageDW-SpecialListRss .deki-pagination .prev a:before, .PageDW-SpecialListRss .deki-pagination .next a:after { content: ""; } /* The feed page has hard-coded arrows so we shouldn't add our own */ .revisionInfo { position: relative; background: #ebebe4; background: rgba(198,198,175,.1); padding: 8px 235px 8px 15px; margin-bottom: 1em; font-size: .857em; overflow: hidden; } .revisionInfo p { margin: 0 0 .5em; } .revisionInfo form { width: 230px; position: absolute; right: 15px; top: 8px; text-align: right; } #deki-pageproperties div.mode { margin: 0 0 1em; font-size: .857em; border-bottom: 1px solid #deded7; width: 100%; float: left; clear: both; } #deki-pageproperties div.mode span { float: left; margin: 0 6px -1px 0; padding: 3px 10px 7px; } #deki-pageproperties div.mode span.basic { background-image: none; } #deki-pageproperties div.mode span:hover { background: #fff; } #deki-pageproperties div.mode span.selected { background: #fff; border: 1px solid #deded7; border-bottom: 0; } #SpecialTags ul { width: 95%; padding: 0 0 0 22px; list-style: square inside; -moz-column-count: 3; -moz-column-gap: 40px; -webkit-column-count: 3; -webkit-column-gap: 40px; column-count: 3; column-gap: 40px; } #SpecialTags li { white-space: normal; } /* @Diff *********/ .deki-diff { margin-top: 1em; } .deki-diff .deki-revision { float: left; width: 45%; padding: 0 2%; } .deki-diff .deki-diffmeta { font-size: .857em; color: #888; margin: 0 0 1em; } /*** @Special search page (this is not the sitesearch in the header) *********/ #searchForm { margin-bottom: 1em; } #searchForm label { margin-right: 15px; } #searchForm #lsearchbox { margin-right: 15px; } #searchForm #select-language { margin-right: 15px; } #searchResults ul { margin: 1em 0; list-style: none; } #searchResults ul li { border-bottom: 1px solid #e2e1de; padding: 1em 20px; background-image: none; } #searchResults .title { margin: 0 0 .25em -20px; font-size: 130%; } #searchResults .itemmatch { margin-bottom: .5em; font-size: 90%; } .deki-parsed-query { font-size: .785em; color: #777; } /* @Code syntax highlighter */ .pageText .dp-highlighter { font: 100% "Courier New", "Andale Mono", monospace; width: auto; } .pageText .dp-highlighter .tools { font-size: .714em; font-family: "Lucida Grande", "Lucida Sans Unicode", Lucida, Arial, Helvetica, sans-serif; } .pageText .dp-highlighter .tools a { font-size: inherit; } /* Misc UI bits */ #xToolbar { overflow: hidden; z-index: 99; } .editable .editIcon { position: relative; font-size: inherit; bottom: .25em; } /*** @Legacy classes - Leftovers from the old wiki. These can be phased out. *********/ span.alllinks { display: block; text-align: right; font-size: 90%; } table.topicpage-table { width: auto; clear: both; } table.topicpage-table td { padding: 10px; width: 50%; vertical-align: top; } table.topicpage-table small { font-size: 90%; } table.standard-table { border: 1px solid #bbb; border-collapse: collapse; } table.standard-table td { padding: 5px; border: 1px solid #ccc; text-align: left; vertical-align: top; } table.standard-table td.header, table.standard-table th { border: 1px solid #bbb; padding: 0 5px; background: #eee; text-align: left; font-weight: bold; } table.fullwidth-table { margin-bottom: 1.5em; border: 1px solid #bbb; border-collapse: collapse; width: 100%; background: #fff; } table.fullwidth-table td { border: 1px solid #ccc; padding: 5px 15px; text-align: left; vertical-align: top; } table.fullwidth-table td.header, table.fullwidth-table th { border: 1px solid #bbb; padding: 0 5px; background: #eee; font-weight: bold; font-size: 1.05em; text-align: left; } table.features-table { margin-bottom: 20px; border-collapse: collapse; width: auto; } table.features-table td { padding-top: 20px; vertical-align: top; } table.features-table td img { float: left; margin: -20px 15px 5px 0px; } table.features-table td p { margin: 0 3px; font-size: 95%; } table.mainpage-table { margin: 0 0 10px 0; border-collapse: collapse; width: auto; } table.mainpage-table td { padding: 0 10px 10px 10px; vertical-align: top; } .article .prewrong pre { border: 1px dashed #ac6262; background: #fbeded; color: #8a4e4e; } .wrong { margin: 0 0 1.5em; padding: 5px; background: #fbeded; border: solid 1px #ac6262; color: #6d675f; } .wrong-inline { border: 1px solid #ac6262; padding: 0 3px 0 3px; background: #fbeded; color: #6d675f; } .article .wrong-source-code { color: #8a4e4e; } .article .right-source-code { color: #537d46; } div.bug, div.warning { margin: 0 0 1.5em; border: 2px solid #ac6262; padding: 0 10px; background: #fbeded; color: #6d675f; } .originaldocinfo { margin: 15px 0; border: 1px solid #e9e9e9; padding: 10px 10px 0; background: #f3f3f3; font-size: 80%; font-family: Verdana, Tahoma, sans-serif; } .originaldocinfo h2 { font-size: 120%; } .licenseblock { border: 1px dashed #ccc; padding: 0 10px; background: #f1f1f1; font-size: 80%; font-family: Verdana, Tahoma, sans-serif; } div.floatright, table.floatright { float: right; clear: right; margin: 0 0 .5em .5em; } div.floatleft, table.floatleft { float: left; margin: 0 .5em .5em 0; } div.thumb { margin-bottom: 0.5em; border: 1px solid #fff; } div.thumb div { border: 1px solid #ccc; padding: 3px; overflow: hidden; background-color: #f9f9f9; font-size: 94%; text-align: center; } div.thumb div a img { border: 1px solid #ccc; } div.thumb div div.thumbcaption { border: none; padding: .3em 0 .1em 0; text-align: left; line-height: 1.4; } div.magnify { float: right; } div.magnify a, div.magnify img { display: block; } div.tright { float: right; clear: right; border-width: .5em 0 .8em 1.4em; } div.tleft { float: left; margin-right: .5em; border-width: .5em 1.4em .8em 0; } table.release { border: 1px solid #ccc; width: 100%; font-size: 95%; } table.release td { border: 1px solid #ccc; padding: 0 0 15px 25px; } tr.releaseHeader td { font-size: 125%;} tr.releaseHeader td.OK { background-color: green;} tr.releaseHeader td.ERR { background-color: red;} tr.releaseHeader td.IP { background-color: yellow;} tr.releaseHeader td.TBD {background-color: grey;} tr.release td.OK { width: 22%; background: #cfc; } tr.release td.ERR { width: 22%; background: #fcc; } tr.release td.IP { width: 22%; background: #ffc; } tr.release td.TBD { width: 22%; background: #eee; } tr.release td.stepLabel { padding: 0 5px 15px 25px; width: 12%; text-align: right; } .OK { background-color: rgb(153,255,153); } .irrelevant { color: rgb(153,153,153); } .maybe { background-color: rgb(255,255,204); } /* MDN styles for CKEditor. Strong selectors to override the default skin */ #docs .cke_skin_kama { border: none; padding: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } #docs #eareaParent .cke_skin_kama .cke_top, #docs #eareaParent .cke_skin_kama .cke_wrapper { background: #ecece7 none; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } #docs #eareaParent .cke_skin_kama .cke_wrapper { padding-top: 0; } #docs .cke_skin_kama .cke_infobar, #docs .cke_editor_editarea .cke_infobar .cke_infopanel_group { background: #ecece7 none; } #docs .cke_skin_kama .cke_toolgroup, #docs .cke_skin_kama .cke_rcombo a, #docs .cke_skin_kama .cke_rcombo a:active, #docs .cke_skin_kama .cke_rcombo a:hover { background: #f7f7f5 none; border: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; box-shadow: 1px 1px 1px rgba(0,0,0,.1); } #docs .deki-new-page-title { border: 0; padding: 0; } /* @RTL - flip the layout for right-to-left languages *********/ /* just a jump to the left... */ .rtl #nav, .rtl #nav-main, .rtl #nav-sub, .rtl .user-state, .rtl #tool-menus, .rtl #tool-menus ul li.menu, .rtl #page-buttons li, .rtl #article-nav, .rtl #site-search button { float: left; } /* then a step to the right... */ .rtl #branding, .rtl #site-search, .rtl #title, .rtl #nav-toolbar .crumbs, .rtl #page-tags h2, .rtl #page-tags #deki-page-tags, .rtl #page-tags .tags-edit, .rtl #site-info #legal, .rtl .deki-pagination div, .rtl .pagination span, .rtl .deki-pagination div.info, .rtl #site-search #q, .rtl #site-search-gg { float: right; } .rtl #doc-shortcuts { left: -200px; } .rtl #nav-sub { margin-left: 12px; } .rtl #masthead .user-state { right: auto; left: 20px; } .rtl .user-state li { margin-left: 0; border-left: 0; padding-left: 0; border-right: 1px solid #666; margin-right: 5px; padding-right: 8px; } .rtl .user-state li:first-child { padding: 0; margin: 0; border: 0; } .rtl .user-state .superfish .sub-menu { right: auto; left: 0; text-align: right; } .rtl .user-state .sub-menu li { display: list-item; text-align: right; border: 0; margin: 0; padding: 0; } .rtl #site-search #q { padding: 5px 28px 5px 4px; margin: -2px 0 0 5px; background-position: 98% -147px; } .rtl #nav-toolbar .crumbs li { padding-left: 13px; margin-left: 6px; background-position: 0 -798px; } .rtl #nav-toolbar .crumbs li.crumb-one { background: url("/web/20120324170846im_/https://developer.mozilla.org/skins/mdn/Transitional/img/nav-arrows.png") 0 -798px no-repeat; } .rtl #nav-toolbar .crumbs li:last-child { background: none; } .rtl #tools.superfish .menu ul { left: 0; right: auto; } .rtl #tools .menu ul { left: auto; right: -999em; } .rtl #nav .nav-menu:hover .sub-menu, .rtl .compact #nav .hover .sub-menu, .rtl .compact #nav a:focus + ul { right: auto; } .rtl #article-nav { padding: 0 20px 1em 0; } .rtl .page-meta h2 { margin: 0 0 0 20px; } .rtl #page-tags #deki-page-tags-toggleview, .rtl .page-meta p.add { right: auto; left: 20px; text-align: left; } .rtl #page-tags #deki-page-tags .tagData { padding-right: 0; padding-left: 30px; } .rtl #page-tags #deki-page-tags .tagButtons { padding-left: 0; padding-right: 10px; float: left; } .rtl #page-buttons { right: auto; left: 20px; } .rtl #site-info #legal { padding: 0 55px 0 0; } .rtl #site-info #legal img { left: auto; right: 0; } .rtl .user-state { text-align: left; } .rtl #menuFiller .deki-file-menu { margin-left: 86px; } .rtl span.icon img { margin: 0 0 0 3px; } .rtl .last-mod, html[dir="rtl"] #footbar p { text-align: left; } .rtl .deki-pagination .next, .rtl .pagination .next { text-align: left; float: left !important; } .rtl .deki-pagination .prev, .rtl .pagination .prev { text-align: right; float: right !important; } .rtl .deki-pagination .prev a:before, .rtl .pagination .prev a:before, .rtl .deki-pagination .next a:after, .rtl .pagination .next a:after { content: ""; } .rtl .deki-pagination .prev a:after, .rtl .pagination .prev a:after { content: "\00A0\00BB"; font-size: 1.1em; } /* space laquo */ .rtl .deki-pagination .next a:before, .rtl .pagination .next a:before { content: "\00AB\00A0"; font-size: 1.1em; } /* raquo space */ /* FILE ARCHIVED ON 17:08:46 Mar 24, 2012 AND RETRIEVED FROM THE INTERNET ARCHIVE ON 00:17:41 Jun 14, 2026. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C. SECTION 108(a)(3)). */ /* playback timings (ms): captures_list: 1.028 exclusion.robots: 0.096 exclusion.robots.policy: 0.075 esindex: 0.019 cdx.remote: 21.969 LoadShardBlock: 100.105 (3) PetaboxLoader3.datanode: 88.154 (4) PetaboxLoader3.resolve: 72.875 (2) load_resource: 67.416 */