html { background-color: #ac0; } html, body { height: 100%; } .container { margin: 0 auto; width: 80%; min-width: 600px; max-width: 1200px; } body, h1, h2 { margin: 0; padding: 0; } h1, h2 { color: #fff; font-family: 'Lato', sans-serif; font-weight: 300; text-shadow: 0 1px 1px rgba(0,0,0,.2); } h1 { text-shadow: 0 1px 3px rgba(0,0,0,.2); font-size: 200px; text-align: center; margin-bottom: 50px; } h1 u { cursor: pointer; border-bottom: 8px dotted #fff; text-decoration: none; } h2 { font-size: 30px; margin-bottom: 10px; } .row { margin-bottom: 30px; } .row:after { clear: both; content: ''; display: block; } .col-left { float: left; width: 35%; padding: 0 20px; box-sizing: content-box; } .col-right { float: left; width: 55%; margin-left: 5%; } .example { top: 0; cursor: pointer; position: relative; transition: all 0.3s; } .example:after { top: 50%; left: 50%; line-height: 0; margin: -5px 0 0 -50px; color: #333; content: '►'; font-size: 100px; position: absolute; display: block; opacity: 0; transition: opacity 0.2s; } .example:hover { top: -5px; box-shadow: 0 2px 8px rgba(0,0,0,.2); } .example:hover:after { opacity: 0.7; } pre code { background-color: #fff; box-shadow: 0 1px 1px rgba(0,0,0,.3); } /* Tomorrow Theme */ /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ /* Original theme - https://github.com/chriskempson/tomorrow-theme */ /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ .tomorrow-comment, pre .comment, pre .title { color: #8e908c; } .tomorrow-red, pre .variable, pre .attribute, pre .tag, pre .regexp, pre .ruby .constant, pre .xml .tag .title, pre .xml .pi, pre .xml .doctype, pre .html .doctype, pre .css .id, pre .css .class, pre .css .pseudo { color: #c82829; } .tomorrow-orange, pre .number, pre .preprocessor, pre .built_in, pre .literal, pre .params, pre .constant { color: #f5871f; } .tomorrow-yellow, pre .class, pre .ruby .class .title, pre .css .rules .attribute { color: #eab700; } .tomorrow-green, pre .string, pre .value, pre .inheritance, pre .header, pre .ruby .symbol, pre .xml .cdata { color: #718c00; } .tomorrow-aqua, pre .css .hexcolor { color: #3e999f; } .tomorrow-blue, pre .function, pre .python .decorator, pre .python .title, pre .ruby .function .title, pre .ruby .title .keyword, pre .perl .sub, pre .javascript .title, pre .coffeescript .title { color: #4271ae; } .tomorrow-purple, pre .keyword, pre .javascript .function { color: #8959a8; } pre { border: 0; margin: 0; padding: 0; } pre code { display: block; color: #4d4d4c; font-size: 15px; font-family: Menlo, Monaco, Consolas, monospace; line-height: 1.5; padding: 30px; }