body { margin: 0; font-family: Helvetica, Arial, sans-serif; font-size: 16px; } pre, code { font-family: Menlo, monospace; font-size: 14px; } pre { line-height: 18px; } pre .comment { color: #375EAB; } pre .highlight, pre .highlight-comment, pre .selection-highlight, pre .selection-highlight-comment { background: #FFFF00; } pre .selection, pre .selection-comment { background: #FF9632; } pre .ln { color: #999; } body { color: #222; } a, .exampleHeading .text { color: #375EAB; text-decoration: none; } a:hover, .exampleHeading .text:hover { text-decoration: underline; } p, pre, ul, ol { margin: 20px; } pre { background: #e9e9e9; padding: 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } h1, h2, h3, h4, .rootHeading { margin: 20px 0; padding: 0; color: #375EAB; font-weight: bold; } h1 { font-size: 24px; } h2 { font-size: 20px; background: #E0EBF5; padding: 2px 5px; } h3 { font-size: 20px; } h3, h4 { margin: 20px 5px; } h4 { font-size: 16px; } .rootHeading { font-size: 20px; margin: 0; } dl { margin: 20px; } dd { margin: 2px 20px; } dl, dd { font-size: 14px; } div#nav table td { vertical-align: top; } table.dir th { text-align: left; } table.dir td { word-wrap: break-word; vertical-align: top; } div#page.wide table.dir td.name { white-space: nowrap; } .alert { color: #AA0000; } div#heading { float: left; margin: 0 0 10px 0; padding: 21px 0; font-size: 20px; font-weight: normal; } div#heading a { color: #222; text-decoration: none; } div#topbar { background: #E0EBF5; height: 64px; overflow: hidden; } body { text-align: center; } div#page { width: 100%; } div#page > .container, div#topbar > .container { text-align: left; margin-left: auto; margin-right: auto; padding: 0 20px; width: 900px; } div#page.wide > .container, div#topbar.wide > .container { width: auto; } div#plusone { float: right; } div#footer { text-align: center; color: #666; font-size: 14px; margin: 40px 0; } div#menu > a, div#menu > input, div#learn .buttons a, div.play .buttons a, div#blog .read a { padding: 10px; text-decoration: none; font-size: 16px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } div#playground .buttons a, div#menu > a, div#menu > input { border: 1px solid #375EAB; } div#playground .buttons a, div#menu > a { color: white; background: #375EAB; } #playgroundButton.active { background: white; color: #375EAB; } a#start, div#learn .buttons a, div.play .buttons a, div#blog .read a { color: #222; border: 1px solid #375EAB; background: #E0EBF5; } div#menu { float: right; min-width: 590px; padding: 10px 0; text-align: right; } div#menu > a { margin-right: 5px; margin-bottom: 10px; padding: 10px; } div#menu > input { position: relative; top: 1px; width: 60px; background: white; color: #222; } div#menu > input.inactive { color: #999; } div.left { float: left; clear: left; } div.right { float: right; clear: right; } div.left, div.right { width: 415px; } div#learn, div#about { padding-top: 20px; } div#learn h2, div#about { margin: 0; } div#about { font-size: 20px; } div#about { height: 96px; } div#gopher { background: url(/doc/gopher/frontpage.png) no-repeat; background-position: center top; height: 155px; } a#start { display: block; padding: 10px; text-align: center; text-decoration: none; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } a#start .big { font-weight: bold; font-size: 20px; } a#start .desc { font-size: 14px; font-weight: normal; margin-top: 5px; } div#learn .icon { float: right; cursor: pointer; } div#learn pre, div#learn textarea { padding: 0; margin: 0; font-family: Menlo, monospace; font-size: 14px; } div#learn .input { padding: 10px; margin-top: 10px; height: 150px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; } div#learn .input textarea { width: 100%; height: 100%; border: none; outline: none; resize: none; } div#learn .output { border-top: none !important; padding: 10px; height: 59px; overflow: auto; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } div#learn .output pre { padding: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } div#learn .input, div#learn .input textarea, div#learn .output, div#learn .output pre { background: #FFFFD8; } div#learn .input, div#learn .output { border: 1px solid #375EAB; } div#learn .buttons { float: right; padding: 20px 0 10px 0; text-align: right; } div#learn .buttons a { height: 16px; margin-left: 5px; padding: 10px; } div#learn .toys { margin-top: 8px; } div#learn .toys select { border: 1px solid #375EAB; margin: 0; } div#learn .output .exit { display: none; } div#blog, div#video { margin-top: 40px; } div#blog > a, div#blog > div, div#blog > h2, div#video > a, div#video > div, div#video > h2 { margin-bottom: 10px; } div#blog .title, div#video .title { display: block; font-size: 20px; } div#blog .when { color: #666; font-size: 14px; } div#blog .read { text-align: right; } .toggleButton { cursor: pointer; } .toggle .collapsed { display: block; } .toggle .expanded { display: none; } .toggleVisible .collapsed { display: none; } .toggleVisible .expanded { display: block; } table.codetable { margin-left: auto; margin-right: auto; border-style: none; } table.codetable td { padding-right: 10px; } hr { border-style: none; border-top: 1px solid black; } img.gopher { float: right; margin-left: 10px; margin-bottom: 10px; } .pkgGopher { text-align: right; } .pkgGopher .gopher { float: none; position: relative; top: -40px; margin-bottom: -120px; } h2 { clear: right; } /* example and drop-down playground */ div.play { padding: 0 20px 40px 20px; } div.play pre, div.play textarea, div.play .lines { padding: 0; margin: 0; font-family: Menlo, monospace; font-size: 14px; } div.play .input { padding: 10px; margin-top: 10px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; overflow: hidden; } div.play .input textarea { width: 100%; height: 100%; border: none; outline: none; resize: none; overflow: hidden; } div#playground .input textarea { overflow: auto; resize: auto; } div.play .output { border-top: none !important; padding: 10px; max-height: 200px; overflow: auto; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; } div.play .output pre { padding: 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } div.play .input, div.play .input textarea, div.play .output, div.play .output pre { background: #FFFFD8; } div.play .input, div.play .output { border: 1px solid #375EAB; } div.play .buttons { float: right; padding: 20px 0 10px 0; text-align: right; } div.play .buttons a { height: 16px; margin-left: 5px; padding: 10px; cursor: pointer; } div.play .output .exit { color: #999; } /* drop-down playground */ #playgroundButton, div#playground { /* start hidden; revealed by javascript */ display: none; } div#playground { position: absolute; top: 63px; right: 20px; padding: 0 10px 10px 10px; z-index: 1; text-align: left; background: #E0EBF5; border: 1px solid #B0BBC5; border-top: none; -webkit-border-bottom-left-radius: 5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } div#playground .code { width: 520px; height: 200px; } div#playground .output { height: 100px; }