html, body { margin: 0; padding: 0; } img { border: 0; vertical-align: middle; } body { color: #ddd; font-size: 14px; font-family: 'Arail', sans-serif; line-height: 140%; background: #202227 url('body.png'); } .body__top { top: 0; left: 0; width: 100%; height: 321px; z-index: -1; position: absolute; background-image: url('body__top.png'); } a { color: #ddd; } a:hover { color: #fff; } .logo { height: 210px; background: url('logo.png') center center no-repeat; } .sidebar { top: 0; left: 0; height: 100%; position: fixed; overflow: auto; overflow-x: hidden; width: 250px; background: url('content.png'); box-shadow: 0 0 20px rgba(0,0,0,.9) } .sidebar ul { list-style: none; padding: 0; margin: 5px 0 5px 15px; } .sidebar a { color: #333; text-decoration: none; } .sidebar a:hover { color: #f60; border-bottom: 1px dotted #f60; } .menu { margin: 20px 15px; font-size: 16px; line-height: 130%; } .menu__name { border-bottom: 1px dotted #333; } h2 { margin: 0 0 10px; font-size: 40px; } h3 { color: #f1f1f1; font-size: 30px; font-weight: 400; } h2, h3, h4 { font-weight: 300; font-family: 'Roboto', sans-serif; } .descr { color: #AAA; margin-top: 5px; margin-bottom: 10px; } .type { color: #ffcc66; font-weight: normal; } .fn { margin: 10px 0 0; font-size: 16px; font-weight: 400; } .fn__args { font-weight: 300; } .args b { font-weight: 400; } h2, h3, h4, .fn, .descr, .args { text-shadow: 0 1px 1px #000; } .code { color: #DDD; font-size: 90%; font-family: monospace; border: 1px solid #666; border-radius: 3px; background-color: rgba(255,255,255,.05); *background-color: #f3f3f3; padding: 0 3px; } .content { margin-left: 300px; margin-right: 50px; position: relative; } .example { margin: 25px; } .example__left { float: left; width: 290px; text-align: center; } .example__right { margin-left: 320px; } .example__code { padding: 1px 20px 0 20px; overflow: auto; max-height: 400px; border-right: 4px solid #DDE0DA; border-bottom: 4px solid #DDE0DA; background-color: #fff; } .example h2 { overflow: hidden; } .example h2 span { float: left; display: block; } .example__tabs { display: block; font-size: 14px; vertical-align: top; } .example__tabs a { color: #36c; cursor: pointer; margin: 0 5px 2px; border-bottom: 1px dotted #36c; } .example__tabs a.active { color: #333; cursor: default; margin: 0; padding: 0 5px 2px; border-bottom: 0; background-color: rgba(0,0,0,.1); *background-color: #eee; } code { font-family: monospace; font-size: 12px; border-radius: 5px; max-width: 800px; max-height: 400px; overflow: auto; background-image: url('content.png'); color: black; } /** * XCode style (c) Angel Garcia */ pre code { display: block; padding: 0.5em; color: black; } pre .comment, pre .template_comment, pre .javadoc, pre .comment * { color: rgb(0,106,0); } pre .keyword, pre .literal, pre .nginx .title { color: rgb(170,13,145); } pre .method, pre .list .title, pre .tag .title, pre .setting .value, pre .winutils, pre .tex .command, pre .http .title, pre .request, pre .status { color: #008; } pre .envvar, pre .tex .special { color: #660; } pre .string { color: rgb(196,26,22); } pre .tag .value, pre .cdata, pre .filter .argument, pre .attr_selector, pre .apache .cbracket, pre .date, pre .regexp { color: #080; } pre .sub .identifier, pre .pi, pre .tag, pre .tag .keyword, pre .decorator, pre .ini .title, pre .shebang, pre .prompt, pre .hexcolor, pre .rules .value, pre .css .value .number, pre .symbol, pre .symbol .string, pre .number, pre .css .function, pre .clojure .title, pre .clojure .built_in { color: rgb(28,0,207); } pre .class .title, pre .haskell .type, pre .smalltalk .class, pre .javadoctag, pre .yardoctag, pre .phpdoc, pre .typename, pre .tag .attribute, pre .doctype, pre .class .id, pre .built_in, pre .setting, pre .params, pre .clojure .attribute { color: rgb(92,38,153); } pre .variable { color: rgb(63,110,116); } pre .css .tag, pre .rules .property, pre .pseudo, pre .subst { color: #000; } pre .css .class, pre .css .id { color: #9B703F; } pre .value .important { color: #ff7700; font-weight: bold; } pre .rules .keyword { color: #C5AF75; } pre .annotation, pre .apache .sqbracket, pre .nginx .built_in { color: #9B859D; } pre .preprocessor, pre .preprocessor * { color: rgb(100,56,32); } pre .tex .formula { background-color: #EEE; font-style: italic; } pre .diff .header, pre .chunk { color: #808080; font-weight: bold; } pre .diff .change { background-color: #BCCFF9; } pre .addition { background-color: #BAEEBA; } pre .deletion { background-color: #FFC8BD; } pre .comment .yardoctag { font-weight: bold; } pre .method .id { color: #000; }