/* -- -- -- -- -- -- -- mezzoblue.com v5 CSS dubbed 'Wintermint' last edit: 7 mar 06 -- -- -- -- -- -- -- Toward future-proofing CSS hacks: Each of the following three files is a separate, browser-specific CSS file that keeps all hacks out of the main style sheet. Over time, as supporting these browsers no longer remains a priority, cleaning up the hacks is as easy as deleting the @import statement. */ /* The file below is read by ALL browsers but the hacks contained within it further target IE5-6 for Windows. See file for details. */ @import "ie6win.css"; /* The file below is ONLY read by IE5/Win. Makes use of the Mid Pass Filter: http://tantek.com/CSS/Examples/midpass.html */ @media tty { i{content:"\";/*" "*/}} @import 'ie5win.css'; /*";} }/* */ /* The file below is ONLY read by IE5/Mac. Makes use of the Band Pass Filter: http://www.stopdesign.com/examples/ie5mac-bpf/ */ /*\*//*/ @import "ie5mac.css"; /**/ /* -- Basic HTML Elements -- */ a:link {color: #0088FF; text-decoration: none;} a:visited {color: #005387; text-decoration: none;} a:hover {color: #fff; background-color: #0088ff; text-decoration: none;} abbr, acronym {font-style: normal; border-bottom: dotted 1px #ABB1B7; cursor: help;} body {color: #3A4956; background: #000000 url(images/container-bg-nosidebar.gif) center top repeat-y; font: 12px/19px "Lucida Grande", "Lucida Sans Unicode", Verdana, Tahoma, Arial, sans-serif; margin: 0; padding: 0; text-align: center; min-width: 730px;} code, var, kbd {font-family: monaco, courier, monospace; color: #B96A0E;} dd {margin: 0; padding: 0 0 1em 17px;} dt {font-weight: bold; padding: 0 0 0 17px; background: url(images/deco-dt.gif) 2px 4px no-repeat;} form {margin: 0;} h1 {font: bold 48px Helvetica, Times, serif; color: #555555; letter-spacing: -1px; margin: 0;} h2 {color: #333333; font: normal 18px Helvetica, Arial, sans-serif; letter-spacing: -1px; margin: 2em 0 0 0;} h3 {font-size: 12px; color: #6F90B5;} h4 {font-size: 12px;} hr {border: none; height: 1px; background: #ccc; margin: 2em 0;} img {border: 0; padding: 0;} ins {text-decoration: none; color: #EC694A;} pre {width: 580px;} table {margin: 2em 0;} table caption {color: #fff; background: #98A0A6;} th {text-align: left; background: #C7CBCE;} a:hover code {color: #AAD7FF;} tr.alt {background: #E9EAEB;} /* -- header -- */ #pageHeader {width: 705px; height: 356px; background: #000000 url(images/header.jpg) 0 0 no-repeat; position: relative;} #pageHeader h2 {margin: 0;} #pageHeader h2 a:link, #pageHeader h2 a:visited {width: 146px; position: absolute; top: 0; left: 4px; display: block; background: none; overflow: hidden; font-size: 1px; height: 0px; padding-top: 152px;} #pageHeader h2 a:hover {background: transparent url(/i/ice/alphafake-blue.gif);} html>body #pageHeader h2 a:hover {background: transparent url(/i/ice/alpha-blue-br.png);} #pageHeader h3, #pageHeader h4 {display: none;} /* -- contentNav -- */ #contentNav {width: 697px; height: 94px; margin: 0 4px; padding: 0; position: relative; top: -1px; background: url(/i/ice/contentnav-panels.gif) 0 0 no-repeat;} #contentNav li {list-style: none; padding: 0; margin: 0; position: absolute; width: 231px; height: 94px;} #contentNav li a:link, #contentNav li a:visited {width: 231px; height: 94px; display: block;} #contentNav li a:hover {background: transparent url(/i/ice/alphafake-red.gif);} html>body #contentNav li a:hover {background: transparent url(/i/ice/alpha-red-dr.png);} #contentNav .li1 {top: 0; left: 0;} #contentNav .li2 {top: 0; left: 233px;} #contentNav .li3 {top: 0; left: 466px;} #contentNav li a span {display: block; position: absolute; top: 69px; left: 14px; overflow: hidden; font-size: 1px; color: #E52C00; padding-top: 13px; height: 0;} #contentNav .li1 a span {width: 108px; background: url(/i/ice/contentnav-articles.gif) no-repeat;} #contentNav .li2 a span {width: 56px; background: url(/i/ice/contentnav-projects.gif) no-repeat;} #contentNav .li3 a span {width: 79px; background: url(/i/ice/contentnav-related.gif) no-repeat;} /* -- search form -- */ #searchBox {position: absolute; top: 126px; left: 400px;} #searchBox label {display: none;} .search #searchBox .advanced label {display: inline;} #searchBox #search {position: absolute; width: 242px; height: 16px; border: none; color: #0088ff; font-size: 11px;} #searchBox .button {position: absolute; left: 244px; height: 17px;} #searchButton:hover {border: solid 1px #4287C8; margin: -1px 0 0 -1px;} #searchBox .advanced {display: none;} .search #searchBox .advanced {display: block; position: absolute; top: 41px; left: -339px; color: #fff;} .search .result {margin-bottom: 2em;} .search .published {font-style: italic;} /* -- footer -- */ #footerBlock {clear: both; background: #3883CA url(/i/ice/footer-bg.gif) repeat-x; padding: 5px 60px;} #footerBlock p {margin: 0; font-size: 10px; color: #fff; line-height: 1.4;} #footerBlock a:link, #footerBlock a:visited {color: #fff;} /* -- pre-footer nav links -- */ #mainContent #navLinks p {color: #BFC3C7; margin: 0;} /* -- Page Structure -- */ #container {width: 705px; text-align: left; margin: 0 auto;} #intro {position: relative;} #pagebody {padding: 1px 0 0 0;} #mainContent {float: left; margin: 30px; width: 650px;} /* original width = 350px */ #sidebar {margin-left: 471px;} /* -- with sidebar -- */ .sidebarplease #container {background: #F7F7F7 url(images/container-bg.gif) repeat-y;} .sidebarplease #mainContent {padding: 16px 0 16px 60px; margin: 0;} /* -- without sidebar -- */ .nosidebarplease #container {background: #F7F7F7 url(images/container-bg-nosidebar.gif) repeat-y;} .nosidebarplease #mainContent {padding: 24px 60px; width: auto;} .nosidebarplease #sidebar {display: none;} /* -- home page, archives -- */ .homePage h1, .archives h1, .homePage h2.olderentries, #monthlyCal caption {color: #EB694A; font: normal 15px Helvetica, Arial, sans-serif; letter-spacing: -1px; margin: 0; text-align: left;} #monthlyCal caption {margin: 15px 0 0 0;} .homePage h2.olderentries {margin-top: 2em;} .homePage h2, .archives h2 {font: bold 18px Helvetica, Arial, sans-serif; color: #E62C00; letter-spacing: -1px; margin: 1em 0 0 0;} .homePage h2 a:link, .homePage h2 a:visited, .archives h2 a:link, .archives h2 a:visited {margin: 0; color: #E62C00;} .homePage h2 a:hover, .archives h2 a:hover {color: #EB694A; background: none;} #mainContent .olderentries, #categorylist, #recentEntries {margin: 0; padding: 0;} #mainContent .olderentries li, #categorylist li, #recentEntries li {margin: 10px 0; padding: 0 0 0 20px; list-style: none; background: url(/i/ice/deco-post.gif) 4px 2px no-repeat;} /* -- second level, second-level nav bar -- */ .essentials .s-essentials a, .comments .s-articles a, .categories .s-articles a, .entry .s-articles a, .a-home .s-articles a, .dailies .s-dailies a, .subscribe .s-rss a, .a-home .s-about a, .bio .s-dave a, .colophon .s-mezzoblue a, .faq .s-faq a, .r-home .s-related a, .reviews .s-reviews a, .p-home .s-projects a, .hotbot .s-hotbot a, .tests .s-tests a, .booklist .s-booklists a, .z-alldesigns .s-alldesigns a, .z-faq .s-faq a, .z-resources .s-resources a, .z-translations .s-translations a, .z-submit .s-submit a {background: #F25A00 url(/i/ice/selectionbar-li-current.gif) bottom right no-repeat;} /* -- content styling -- */ #mainContent ul li {list-style: none; padding: 0 0 0 16px; margin: 0; background: url(/i/ice/li2.gif) 2px 4px no-repeat;} #mainContent a:link, #mainContent a:visited {border-bottom: dotted 1px #94CBFA;} #mainContent a:hover {border-bottom: none;} #mainContent h2 a:link, #mainContent h2 a:visited, #mainContent .reply a:link, #mainContent .reply a:visited {border-bottom: none;} .post {position: relative; padding-top: 1px;} .post p {margin: 0 0 1em 0;} #mainContent .context {margin: 1em 0 0 0;} #sidebar .context {margin: 1em 20px; font-size: 10px;} /* -- article styling -- */ .entry .lead {color: #7A9EC5; float: right; width: 265px; font-size: 17px; line-height: 24px; text-align: left; margin: 0 0 1em 0; position: relative; left: 35px;} html>body .entry .divider {position: relative; left: -57px; margin: 2em -57px; border: 0; height: 1px; background: #ccc;} .archiveBrowser {line-height: 42px; height: 42px; background: url(/i/ice/archivebrowser-bg.gif) repeat-x; padding: 0 10px 0 0; position: relative; left: -58px; width: 457px;} #mainContent .archiveBrowser ul {margin: 0; padding: 0;} #mainContent .archiveBrowser li {display: inline; background: none;} #mainContent .archiveBrowser a:link, #mainContent .archiveBrowser a:visited {color: #fff; border: 0;} #mainContent .next {float: right;} .metadata {margin: 30px 0; padding: 0 10px; background: #eee; border: solid 1px #ccc;} .metadata h2 {margin: 10px 0 0 0;} /* -- replies -- */ #mainContent p.reply {color: #9FB6CA; font-size: 10px; line-height: 1; padding: 0 0 2em 10px; background: url(/i/ice/deco-reply.gif) 0 0 no-repeat;} .entry #mainContent p.reply {padding-bottom: 1em;} div.reply {position: relative; margin: 0 40px 3em 40px;} div.reply .replynumber {position: absolute; font-size: 22px; top: 2px; left: -38px; letter-spacing: -2px;} div.reply .replynumber a:link, div.reply .replynumber a:visited {color: #ccc;} div.reply .replynumber a:hover {color: #fff;} .reply-body {width: 500px; overflow: hidden;} .dave {background: #F4CFC6;} .dave p {padding: 0 5px;} .entry #mainContent p.postedBy {font-weight: bold; margin-bottom: 0;} .entry #mainContent p.posttimestamp {position: absolute; top: -1em; right: 0; color: #999;} .dave .postedBy {background: #E62E00; color: #fff; padding: 3px;} .dave .postedBy a {color: #fff;} .entry #mainContent .dave p.posttimestamp {top: -0.8em; color: #fff;} .entry #mainContent .dave p.posttimestamp a:link, .entry #mainContent .dave p.posttimestamp a:visited {color: #fff;} /* -- sidebar -- */ #sidebar {padding-bottom: 1em;} #sidebar h2 {display: none;} #sidebar h3 {color: #EB694A; font: normal 15px Helvetica, Arial, sans-serif; letter-spacing: -1px; margin: 15px 20px 6px 20px; text-transform: none;} #sidebar dl, #sidebar dl p {margin: 0 20px; font-size: 10px; line-height: 1.4;} #sidebar dt, #sidebar dd {margin: 0; padding: 0 0 0 7px;} #sidebar dt {background: url(/i/ice/deco-li.gif) 0 4px no-repeat; font-weight: normal;} #sidebar dd p {margin: 0 0 10px 0;} #sidebar caption {background-color: transparent;} #recentposts ul {padding: 8px 8px 0 8px; margin: 0;} #recentposts li {padding: 0; margin: 0 0 10px 30px; list-style: none; line-height: 1.2; position: relative;} #recentposts .date {display: block; font-size: 10px; color: #A4AAB1;} #recentposts .comments {display: block; width: 24px; height: 21px; line-height: 1; font-size: 11px; text-align: center; padding-top: 2px; background: url(/i/ice/comment-bubble.gif) no-repeat; top: 2px; left: -30px; position: absolute; text-shadow: #fff 2px 2px 1px;} #sidebar div#recentposts p {margin: 0; line-height: 1.5; padding-left: 38px; background: url(/i/ice/li2.gif) no-repeat 28px 8px; font-size: 12px;} #sidebar div#recentposts p.extra {padding-bottom: 0;} /* -- content-specific -- */ #dailiesArchives {margin: 0 20px; font-size: 10px; background: url(/i/ice/sidebar-horizontal-list.gif) 0 0 no-repeat; padding: 0 15px; text-align: right; height: 22px;} #dailiesArchives li {display: inline; list-style: none; color: #BAC1C7;} #theDailies p {margin: 0 15px 0.7em 25px; font-size: 11px; line-height: 1.4;} #theDailies dd {margin-bottom: 0.7em;} #recommending h4, #zenbookpromo h4 {font-size: 10px; line-height: 1.7; padding-top: 11px; margin: 0 0 10px 87px;} #recommending img, #zenbookpromo img {margin-bottom: 0; padding-bottom: 0;} #recommending .author, #zenbookpromo .author {display: block;} #recommending ul, #zenbookpromo ul {text-align: right; padding: 0 10px 0 0; margin: 10px 0 0 0; background: url(/i/ice/sidebar-panel-b.gif) bottom left no-repeat;} #recommending li, #zenbookpromo li {display: inline; list-style: none; color: #BAC1C7; font-size: 10px; white-space: nowrap;} .monthly {padding: 0; margin: 0;} .monthly #sidebar li, .dailies #sidebar .monthly li, .categories #catlist li {list-style: none; padding-left: 2em;} #monthlyCal {margin: 1em 20px 0 20px; border: 0;} #monthlyCal th {width: 21px; height: 14px; background: url(/i/ice/cal-th-bg.gif) no-repeat; padding: 0; line-height: 1; font-size: 10px; text-align: center;} #monthlyCal td {color: #bbb; text-align: center; padding: 0;} #monthlyCal td a:link, #monthlyCal td a:visited {display: block; background: #fff;} #monthlyCal td a:hover {background: #08f;} .categories #catlist {padding: 0; margin: 0;} .p-home #mainContent img, .a-home #mainContent img {margin-top: 12px;} .p-home #mainContent p, .a-home #mainContent p {margin-left: 77px;} .p-home #mainContent p.lead, .a-home #mainContent p.lead {margin-left: 0;} .p-home #mainContent h2, .a-home #mainContent h2 {margin-top: 1em;} .related dt img {vertical-align: middle; margin: 0 2px;} /* -- reusable -- */ .flLeft {float: left; margin: 0 15px 0 0;} .flRight {float: right; margin: 0 0 0 15px;} .flNone {margin: 0.5em auto; text-align: center;} #mainContent a.imglink:link, #mainContent a.imglink:visited {border: none;} a.imglink:hover {background: transparent;} .calPage {color: #BDBDBD; font-size: 10px; text-shadow: #fff 1px 1px 1px; display: block; background: url(/i/ice/deco-date1.gif) 0 0 no-repeat; position: absolute; text-align: center; text-transform: uppercase; line-height: 1; margin-top: 0; width: 35px; padding-top: 5px; top: 20px; left: -40px;} .calPage .day {display: block; font-weight: bold; font-size: 20px; text-indent: -3px; letter-spacing: -2px; color: #ddd; text-shadow: #bbb 2px 2px 0; background: url(/i/ice/deco-date2.gif) bottom left no-repeat; padding-bottom: 5px;} .panel {background: url(/i/ice/sidebar-panel-t.gif) 0 0 no-repeat; margin: 0 20px;} .panel p {margin: 0; font-size: 10px; line-height: 1.4; padding: 5px 8px 7px 8px; background: url(/i/ice/sidebar-panel-b.gif) bottom left no-repeat;} .panel p.extra {padding: 5px 8px 7px 8px; background: none;} .panel hr {height: 1px; border: 0; background: #ccc; margin: 5px 15px;} .panel .flLeft {float: left; margin: 10px 8px 5px 8px;} span.date, .pseudoheader {color: #BFC3C7;} .pro {padding-left: 65px; background: url(/i/ice/pc-pro.gif) no-repeat 0 0;} .con {padding-left: 65px; background: url(/i/ice/pc-con.gif) no-repeat 0 0;} .undetermined {padding-left: 65px; background: url(/i/ice/pc-undetermined.gif) no-repeat 0 0;} #mainContent a.photo-link:link, #mainContent a.photo-link:visited, #mainContent a.photo-link:hover {border: 0; background: none;} .photo-link img {border: solid 1px #E3E3E3; border-top: 0; border-left: 0; background: #fff; padding: 10px; margin-top: 1em;} /* -- reply form -- */ #replyForm {margin: 1em 0; background: #eee; border: solid 1px #e6e6e6; padding: 10px;} #replyForm span {display: block; margin: 0; background: #f6f6f6; padding: 2px 4px; border: solid 1px #e6e6e6; border-width: 1px 0;} #replyForm label {width: 115px; float: left;} #replyForm .submit label {float: none; width: auto;} #replyForm h2, #replyForm p {display: inline;} #replyForm textarea {width: 420px;} #replyForm textarea.preview {width: 320px;} #preview {margin-right: 15px;} .submit input {float: left; border: solid 1px #419EC5; color: #fff; background: #4CBAE8; padding: 3px;} #text {clear: left;} /* -- XFN spice -- */ #mainContent dt a[rel~="met"] {border-bottom: dotted 1px #1D68AA;} /* -- Accessibility Tweaks -- */ #skipNav {position: absolute; left: -9999px; font-size: small;} #skipNav a:hover {color: #f00;} #skipNav a:focus {display: block; position: absolute; top: -120px; left: 9990px; font-size: large; background: #fff; border: solid 2px #1B6BD8; padding: 10px; width: 15em; z-index: 1;} .hide {display: none;}