/* revised : 03/04/2010 : dw */ /* all media */ @media all { /* global */ * { margin:0; padding:0; } html { overflow-y:scroll; } body { font-family:'lucida grande',tahoma,verdana,arial,sans-serif; font-size:62.5%; color:#222; } /* layout: general */ #page { } /* layout: header */ #header { height:120px; background:url(images/header.gif) 0 0 repeat-x #fcfcfc; position:relative; } #logo { position:absolute; height:100px; width:129px; top:8px; left:0; text-indent:-10000px; display:block; background:url(images/sprite.png) -371px 0 no-repeat; } #logo:hover { /*-webkit-transition: -webkit-transform 1s ease-in; -webkit-transform:rotate(360deg);*/ } #header-announce { font-family:"Droid Serif"; position:absolute; left:140px; top:20px; font-size:3.0em; font-weight:bold; color:#444; } #header-description { color:#777; position:absolute; left:140px; top:60px; width:280px; font-size:1.25em; line-height:1.6em; } #search-area { position:absolute; top:10px; right:10px; } #search-options { display:none; /* inline-block; */ width:16px; height:16px; line-height:1.6em; text-indent:-10000px; background:url(images/advanced-search.png) 0 0 no-repeat; } #search-box { width:200px; font-size:2.2em; } .placeholder { padding-left:30px; padding-top:5px; padding-bottom:5px; color:#999; font-size:13px !important; border:1px solid #bbb; background:url(images/sprite.png) 0 -329px no-repeat; } #search-submit { display:none; } #search-results { position:absolute; z-index:90; top:40px; right:10px; visibility:hidden; } #search-results-pointer { width:0px; height:0px; border-left:20px solid transparent; border-right:20px solid transparent; border-bottom:20px solid #eee; margin-left:80%; } #search-results-content { position:relative; padding:20px; background:#fff; border:3px solid #eee; width:380px; min-height:200px; -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5) } #header-affiliations { position:absolute; top:40px; right:0; height:40px; width:400px; } #header-links { position:absolute; top:40px; right:10px; } #header-links ul { list-style-type:none; padding:0; margin:0; } #header-links ul li { padding-left:20px; text-align:right; line-height:1.2em; } #header-links ul li a { font-size:1.1em; font-weight:bold; /* text-shadow:1px 1px 0 #ccc; */ } #header-links ul li a:visited, #header-links ul li a:link { color:#2e71b8; text-decoration:none; } #header-links ul li a:hover, #header-links ul li a:active { color:#900; text-decoration:none; } #header-ad a { position:absolute; top:7px; left:450px; width:300px !important; height:100px !important; display:block; } /* layout: content pages */ #content { min-height:500px; padding:20px 0; } #content-left { width:575px; float:left; margin:0 30px 0 0; } #homepage-post { } #homepage-ad, #homepage-ad-2, #sidebar-ad-2 { margin:20px auto; padding:5px 10px; width:390px; } #homepage-more { } .homepage-more, .featured-more { margin:0 0 30px 0; } .homepage-more h3 a, .featured-more h3 a { padding-left:30px; background:url(images/sprite.png) -473px -359px no-repeat; display:block; } .homepage-more .meta, .featured-more .meta { margin-top:5px; } #pagination { text-align:right; margin:0 0 20px 0; float:right; } #content-left > ul, #wp_simple_sitemap ul { font-size:1.2em; } #content-right { width:395px; float:left; } #show-stopper { margin:0 0 20px 0; } #show-stopper a { padding-left:15px; height:13px; padding:75px 0 0 0; display:block; width:80px; text-align:center; font-weight:bold; font-size:1.2em; text-decoration:none; float:left; margin-left:15px; } #show-stopper a span { /* font-size:.85em; */ font-size:1.2em; } #rss-link { background:url(images/sprite.png) -73px -6px no-repeat; color:#e85f0e; } #rss-link span { color:#f98f51; } #rss-tweet { background:url(images/sprite.png) -161px 7px no-repeat; } #rss-tweet span { color:#5e9fbe; } #rss-demos { color:#028433; background:url(images/sprite.png) 8px 5px no-repeat; } #rss-demos span { color:#24a555; } #rss-sns { color:#900; background:url(images/sprite.png) -238px 5px no-repeat; } #rss-sns span { color:#ef5f5f; } #sidebar-ads { } #bsap_1236348 a { float:left; } #bsap_1242453 a { display:block; } .sidebar-ad, #sidebar-ad-2 { margin:0 0 20px 0; } .sidebar-item { margin:0 0 20px 0; position:relative; } .sidebar-contents { padding:5px 0 0 0; } .sidebar-contents ul { padding:0; margin:0; list-style-type:none; } .sidebar-contents > ul, .sidebar-contents > p, .sidebar-contents > div { display:none; } .sidebar-contents ul li { font-size:1.2em; } .sidebar-contents ul li a, .sidebar-contents p a { color:#900; } .sidebar-contents p { color:#555; padding-left:15px; padding-right:15px; } .sidebar-contents div p, .sidebar-contents div ul, .sidebar-contents div div { display:block; } div#hot-topics { padding-left:25px; } div#hot-topics a { float:left; margin: 0 25px 0 0; width:64px; height:13px; display:block; padding:70px 0 10px 0; color:#354568; font-weight:bold; text-decoration:none; font-size:1.2em; text-align:center; } div#hot-topics a:hover { color:#900; } ul#all-topics { list-style-type:none; margin:0; padding:0; text-align:center; text-align:center; } ul#all-topics li { padding-right:8px; float:left; } ul#all-topics li a { background:url(images/tag.jpg) 0 2px no-repeat; color:#000; padding:3px 6px 3px 16px; font-size:.95em; } ul#all-topics li a:link, ul#all-topics li a:visited { color:#000; text-decoration:none; } ul#all-topics li a:hover, ul#all-topics li a:active { color:#000; text-decoration:underline; } #friends-holder { text-align:center; } #friends-holder a { border:2px solid transparent; display:inline-block; } #friends-holder a:hover { border-color:#ccc; } #friends-holder a img { display:block; } li.tweet { background:url(images/tbird.png) 0 0 no-repeat; color:#555; } li.tweet:hover { background:url(images/bird-green.png) 0 0 no-repeat; color:#222; } li.tweet:hover a.hash { color:#999; } li.amp { background:url(images/amp.png) 6px 0 no-repeat; } li.moo { background:url(images/moo-icon-small.png) 6px 2px no-repeat; } li.classic { background:url(images/mini-demo.png) 6px 2px no-repeat; } li.tweet, li.amp, li.moo, li.classic { padding:0 0 0 35px; line-height:2em; cursor:default; } li.tweet:hover a, li.amp a:hover, li.moo a:hover, li.classic a:hover { color:#12b800; } /* layout: footer */ #footer { padding:20px 0; background:url(images/footer.gif) 0 0 repeat-x #fcfcfc; min-height:200px; } #footer-1,#footer-2,#footer-3 { float:left; } #footer-1 { width:300px; } #footer-2 { width:300px; margin:0 30px; } #footer-friends { } #footer-friends a img { width:32px; height:32px; margin-right:5px; } #footer-3 { width:340px; } #footer p { } #footer h5 { font-size:2em; color:#444; } #footer h5 span { color:#ccc; } /* selection: safari, mozilla */ ::selection { background:#c3effd; color:#000; } ::-moz-selection { background:#c3effd; color:#000; } /* tags */ abbr { border-bottom:1px dotted #ccc; cursor:help; } blockquote { background:#eee; margin:0 20px; padding:10px 20px; } code { font-family:'Consolas', 'Monaco', 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important; } h1 { font-size:4.3em; margin:0 0 20px 0; color:#3073ba; } h2 { font-size:2.8em; } h1, h2, h3, h4, h6 { font-weight:normal; font-family:"Droid Serif",Cambria,Georgia,Palatino,"Palatino Linotype","Myriad Pro",Serif; } h3, h6 { font-size:2em; } h4 { font-size:1.5em; } h6 { padding:0 0 5px 0; } label,select,input[type='submit'],.point { cursor:pointer; } li { } li,p { line-height:19px; margin-top:5px; } ol, ul { padding:0 0 10px 35px; } p { margin:5px 0 14px 0; font-size:1.2em; line-height:1.8em; } pre { position:relative; margin-bottom:10px; } textarea,input[type='text'], input[type='email'], input[type='password'] { border:1px solid #ccc; padding:5px; font-size:120%; font-family:'lucida grande',tahoma,verdana,arial,sans-serif; } /* custom */ .accessibility { display:block; position:absolute; top:-1000px; left:-1000px; } .actions { margin:5px 0 15px 0; } .add { } .b { font-weight:bold; } .block { display:block; } .center { width:1000px; margin:0 auto; position:relative; } .clear { clear:both; } .guest-blogger-top, .guest-blogger-bio { background:#333; color:#fff; padding:5px 10px; margin-bottom:10px; } .guest-blogger-top a, .guest-blogger-bio a { color:#6d84b4; } .image { float:right; margin:0 0 20px 20px; } .larger { font-size:1.3em; } .message { font-size:1.1em; background:#fffea1; border:1px solid #fc0; padding:5px 10px; } .meta { } .meta-debuted { background:#b7eaae; padding:3px 6px; display:inline-block; -webkit-border-radius:5px; font-size:1.1em; cursor:default; margin:0 10px 0 0; } .meta-tags { } .meta-tags a { display:inline-block; background:url(images/tag.jpg) 0 2px no-repeat; -webkit-border-radius:5px; -moz-border-radius:5px; padding:3px 6px 3px 17px; color:#000; } .meta-tags a:visited, .meta-tags a:link { text-decoration:none; color:#000; } .meta-tags a:hover, .meta-tags a:active { text-decoration:underline; } .page-break,.print-only { display:none; } #share-slider { display:inline; } #share-slider a { width:16px; height:19px; display:inline-block; text-indent:-9999px; background-image:url(images/share-icons.png); background-repeat:no-repeat; margin:0 0 0 6px; line-height:20px; } .sponsor { -webkit-border-radius:5px; -moz-border-radius:5px; width:123px; height:123px; border:1px solid #ccc; background:url(images/logo-gs.png) center center no-repeat #eee; float:left; margin:0 0 5px 5px; } .sponsor-long { -webkit-border-radius:5px; -moz-border-radius:5px; display:inline-block; width:390px; height:75px; border:1px solid #ccc; background:url(images/logo-gs.png) center center no-repeat #eee; } #tooltip-container { position:absolute; width:100px; display:inline-block; z-index:20; visibility:hidden; } #tooltip-arrow-up { width:0px; height:0px; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:5px solid #2f2f2f; margin:0 auto; } #tooltip-content { color:#fff; background:#2f2f2f; padding:5px 10px; font-size:1em; text-align:center; -webkit-border-radius:5px; -moz-border-radius:5px; } .share-container { position:absolute; width:260px; z-index:20; visibility:hidden; } .share-arrow-up { width:0px; height:0px; border-left:5px solid transparent; border-right:5px solid transparent; border-top:5px solid #eee; margin:0 auto; } .share-content { background:#fcfcfc; border:3px solid #eee; padding:5px 10px; font-size:1.1em; text-align:center; -webkit-border-radius:5px; -moz-border-radius:5px; } /* single post page */ #related, input[type='submit'] { background:#e8f0f5; border:1px solid #e5e9ed; padding:10px; -moz-border-radius:3px; -webkit-border-radius:3px; margin-bottom:20px; } #related { background:url(images/related.png) 98% 10px no-repeat #e8f0f5; } #related ul { padding:0; margin:0; list-style-type:none; } #related ul li { } #related ul li a { font-size:1.15em; text-decoration:none; text-shadow:1px 1px 0 #fff; } input[type='submit'] { font-size:1.3em; font-weight:bold; } input[type='submit']:hover { background:#d2e6f5; } /* comments */ ol#comment-list { list-style-type:none; margin:0; padding:0; } ol#comment-list > li { margin:20px 0 40px 0; } ol#comment-list li > div { position:relative; } .comment-content { background:#f3f3f3; padding:10px 10px 5px 10px; } .comment-content:hover { background:#eee; } .comment-author { position:absolute; top:-20px; left:60px; } .comment-author a { text-decoration:none !important; } .comment-avatar { width:24px; height:24px; border:3px solid #ccc; position:absolute; top:-20px; left:20px; } .comment-time { top:-20px; color:#bbb; right:20px; position:absolute; } .comment-author, .comment-time { font-size:1.2em; font-family:'Consolas', 'Monaco', 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important; } .comment-reply { position:absolute; bottom:-10px; right:20px; } ol#comment-list ul { list-style-type:none; background:url(images/reply_arrow.gif) 10px 20px no-repeat; margin-top:40px; padding-bottom:0; margin-bottom:0; } ol#comment-list ul li { position:relative; margin-top:30px; } .dw .comment-content { background:#e8f0f5; } .dw .comment-avatar { border:0; } .dw .comment-author { } .overTxtLabel { font-style:italic; margin-top:4px; color:#999; font-size:1.1em; } #form-error-message { border:1px solid #fc0; background:#fffea1; padding:5px 10px; } /* links */ a { color:#2e71b8; } a:link, a:visited { text-decoration:underline; } a:visited { color:#6d84b4; } a:hover, a:active { text-decoration:none; } a img { border:0; } a span { cursor:pointer; } h1 a:hover, h1 a:active, h3 a:hover, h3 a:active { color:#2e71b8; } h1 a:visited, h1 a:link, h3 a:visited, h3 a:link { text-decoration:none; color:#579ae1; } a.button { display:inline-block; height:23px; padding:0 0 0 3px; font-size:11px; font-weight:bold; color:#333; text-shadow:1px 1px 0 #fff; background:url(images/buttons.png) 0 0 no-repeat; white-space:nowrap; border:none; overflow:visible; cursor:pointer; text-decoration:none; } a.button > span { display:block; height:23px; padding:0 10px 0 8px; line-height:23px; background:url(images/buttons.png) 100% 0 no-repeat; } a.button:hover, a.button:focus, a.button-mo { color:#fff; text-decoration:none; text-shadow:-1px -1px 0 rgba(0,0,0,0.3); background-position:0 -30px; } a.button:hover > span, a.button:focus > span, a.button-mo > span { background-position:100% -30px; } a.button-red { background:url(images/buttons.png) 0 -90px no-repeat; color:#fff; text-shadow:-1px -1px 0 rgba(0,0,0,0.3); } a.button-red > span { background-position:100% -90px; } a.button-blue { background:url(images/buttons.png) 0 -30px no-repeat; color:#fff; text-shadow:-1px -1px 0 rgba(0,0,0,0.3); } a.button-blue > span { background-position:100% -30px; } a.button-blue:hover, a.button-blue:focus, a.button-mo { color:#fff; text-decoration:none; text-shadow:-1px -1px 0 rgba(0,0,0,0.3); background-position:0 -90px; } a.button-blue:hover > span, a.button-blue:focus > span, a.button-mo > span { background-position:100% -90px; } a.button-white:hover, a.button-white:focus { color:#333; text-shadow:1px 1px 0 #fff; background-position:0 0; } a.button-white:hover > span, a.button-white:focus > span { background-position:100% 0px; } /*twitter*/ a.hash { text-decoration:none !important; } a.hash:link, a.hash:visited { color:#999; } /* share links */ .share-content a { width:24px; height:24px; margin:0 12px 0 0; text-indent:-9000px; display:inline-block; } #footer a { display: inline-block; outline: 0; padding:0 2px; color: #2e71b8; text-decoration:none; -webkit-transition-duration: 0.25s; -moz-transition-duration: 0.25s; -o-transition-duration: 0.25s; transition-duration: 0.25s; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; transition-property: transform; -webkit-transform: scale(1) rotate(0); -moz-transform: scale(1) rotate(0); -o-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } #footer a:hover { background: #579ae1; text-decoration: none; color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -webkit-transform: scale(1.05) rotate(-1deg); -moz-transform: scale(1.05) rotate(-1deg); -o-transform: scale(1.05) rotate(-1deg); transform: scale(1.05) rotate(-1deg); } #footer a:nth-child(2n):hover { -webkit-transform: scale(1.05) rotate(1deg); -moz-transform: scale(1.05) rotate(1deg); -o-transform: scale(1.05) rotate(1deg); transform: scale(1.05) rotate(1deg); } /* to the top */ a#totop { color:#090; font-weight:bold; text-shadow:1px 1px 0 #ccc; bottom:10px; right:10px; font-size:1.1em; position:fixed; display:block; z-index:10; } a#selection-image { width:24px; height:24px; background:url(images/search2.png) 0 0 no-repeat; position:absolute; top:-50; left:-50px; z-index:2000; display:block; } /* for article headers; priority on the bottom */ .homepage-more h3 a[title*='CSS'], .homepage-more h3 a[title*='CSS3'] { background-image:url(images/feather-tiny.png); background-position:6px 2px; } .homepage-more h3 a[title*='jQuery'] { background-image:url(images/jquery-tiny.png); } .homepage-more h3 a[title*='Dojo'], .homepage-more h3 a[title*='Dijit'] { background-image:url(images/dojo-mini.png); background-position:6px 0; } .homepage-more h3 a[title*='MooTools'] { background-image:url(images/moo-icon-small.png); background-position:6px 0; } .homepage-more h3 a[title*='HTML'], .homepage-more h3 a[title*='XHTML'], .homepage-more h3 a[title*='HTML5'] { background-image:url(images/textmate-mini.png); background-position:6px 0; } /* pre widgets */ .copy { width:16px; height:16px; position:absolute; right:10px; top:10px; text-indent:-9999px; display:block; background:url(images/sprite.png) -314px -165px no-repeat; } /* library :: lighter.js highlighting */ .standardLighter{font-family:Monaco,Courier,Monospace;font-size:10px;overflow:auto;white-space:pre-wrap;white-space:-moz-pre-wrap;white-space:-o-pre-wrap;white-space:-pre-wrap;word-wrap:break-word;}.standardLighter span{color:black;font-size:11px;}.standardLighter .standardnum{background-color:#f2f2f2;color:#939393;font-size:10px;text-align:center;width:30px;}.standardLighter .standardline{background-color:#fff;border-top:1px solid #fff;border-bottom:1px solid #fff;border-left:1px solid #939393;padding:0 3px 0 10px;padding-left:15px;padding-right:5px;}.standardLighter .standardfirst{padding-top:5px;}.standardLighter .standardlast{padding-bottom:5px;}.standardLighter .alt{border-top:1px solid #eee;border-bottom:1px solid #eee;background-color:#F4F8FC;}pre.standardLighter{background-color:#fff;padding-left:15px;padding-right:5px;padding-top:5px;padding-bottom:5px;}ol.standardLighter{color:#939393;font-size:10px;list-style:decimal-leading-zero;background-color:#f2f2f2;margin-top:0;margin-bottom:0;margin-left:0;padding-left:0;}ol.standardLighter li{margin-left:40px;}div.standardLighter .standardnum{display:block;float:left;}div.standardLighter .standardline{display:block;margin-left:30px;min-height:12px;}div.standardLighter div{clear:left;overflow:auto;background-color:#f2f2f2;}.standardLighter .kw1{color:#1b609a;}.standardLighter .kw2{color:#9a6f1b;}.standardLighter .kw3{color:#784e0c;}.standardLighter .kw4{color:#9a6f1b;}.standardLighter .co1{color:#888;}.standardLighter .co2{color:#888;}.standardLighter .st0{color:#489a1b;}.standardLighter .st1{color:#489a1b;}.standardLighter .st2{color:#489a1b;}.standardLighter .nu0{color:#70483d;}.standardLighter .me0{color:#666;}.standardLighter .me1{color:#666;}.standardLighter .br0{color:#444;}.standardLighter .sy0{color:#444;}.standardLighter .es0{color:#444;}.standardLighter .re0{color:#784e0c;} /* custom lighter */ .standardLighter { position:relative; min-height:50px; margin-bottom:5px; } /* post code */ .file,.function,.func,.parameter,.param,.var,.variable, code { font-family:'Consolas', 'Monaco', 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace !important; padding:3px; border:1px solid #ccc; background:#eee; } } /* print media */ @media print { /* global */ * { font-family:arial, helvetica, sans-serif; } body { color:#000; font-size:9pt; } /* layout */ #header, #navigation, .no-print { display:none; } .meta, .meta-more, a.button, #content-right, #footer1, #footer2, #footer3 { display:none; } #content-left { float:none; width:auto; margin:0; padding:0; } ol#comment-list li { border:1px solid #999; } /* custom */ .print-only { display:block; } .page-break { page-break-before:always; } /* links */ a { text-decoration:underline; color:#999; } a:link:after, a:visited:after { content:" [" attr(href) "] "; } }