custom.css

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700|PT+Mono|Roboto+Slab:400,700);
/* 

Hyrule Theme for iPython Notebooks

CC:BY Mart van de Ven ~ m@type.hk

*/
html {
  font-size: 62.5%;
}
body {
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  line-height: 2.4rem;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Roboto Slab', serif;
  margin-bottom: 2.4rem;
}
h1 {
  font-size: 26px;
  font-size: 2.6rem;
  line-height: 4.8rem;
  text-align: center;
}
h2 {
  font-size: 22px;
  font-size: 2.2rem;
  line-height: 4.8rem;
}
h3 {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 2.4rem;
}
h4 {
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: bold;
  line-height: 2.4rem;
}
div#notebook,
p {
  font-size: 18px;
  font-size: 1.8rem;
  margin-bottom: 2.4rem;
  line-height: 2.4rem;
}
li {
  line-height: 3.6rem;
}
*,
*:before,
*:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
img[alt="break"] {
  width: 8rem;
  margin: 0 auto;
}
img[alt="credits"] {
  width: 10rem;
  margin: 4rem;
  margin-left: 1rem;
  margin-bottom: 1rem;
}
img[alt="credits"] + strong {
  margin-left: 3rem;
}
img[alt="prefix"] {
  width: 4rem;
  margin-right: 2rem;
  float: left;
}
img.lead {
  margin-bottom: 2.4rem;
}
blockquote + footer {
  float: right;
  margin-right: 8rem;
  margin-bottom: 2rem;
}
.rendered_html pre {
  margin: 0;
}
body > .container,
#notebook-container {
  max-width: 100rem;
}
div.text_cell_render {
  max-width: 100rem;
}
p.resource-container {
  border-radius: 0.5rem;
  position: relative;
  overflow: hidden;
}
p.resource-container a {
  height: 18rem;
  text-decoration: none;
  padding-top: 8rem;
  display: block;
  color: white;
}
p.resource-container a:visited,
p.resource-container a:link {
  text-decoration: none;
}
p.resource-container a p {
  font-family: 'Roboto Slab', serif;
  font-size: 4rem;
  color: black;
  margin: 0;
  text-align: center;
  font-weight: 700;
  color: white;
  text-shadow: 1px 1px 7px #333;
}
p.resource-container a div {
  height: 18rem;
  width: 100rem;
  background-size: cover;
  background-position: center;
  text-align: center;
  -webkit-filter: brightness(1.2) blur(2px) grayscale(1);
  -webkit-filter: brightness(1.2) blur(2px);
  -webkit-transition: all 200ms cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 200ms cubic-bezier(0.215, 0.61, 0.355, 1);
  position: absolute;
  top: 0;
  z-index: -1;
}
p.resource-container a:hover div {
  -webkit-filter: initial;
  filter: initial;
  -webkit-transition: all 260ms cubic-bezier(0.215, 0.61, 0.355, 1);
  transition: all 260ms cubic-bezier(0.215, 0.61, 0.355, 1);
}
.CodeMirror {
  font-family: 'PT Mono', monospace;
}
/* Based on Sublime Text's Monokai theme */
.CodeMirror-lines {
  background: #272822;
  color: #f8f8f2;
}
.CodeMirror-lines div.CodeMirror-selected {
  background: #49483e !important;
}
.CodeMirror-lines .CodeMirror-gutter {
  background: #272822;
  border-right: 0px;
}
.CodeMirror-lines .CodeMirror-gutter-text {
  color: #d0d0d0;
}
.CodeMirror-lines .CodeMirror-cursor {
  border-left: 1px solid #f8f8f0 !important;
}
.CodeMirror-lines span.cm-comment {
  color: #75715e;
}
.CodeMirror-lines span.cm-atom {
  color: #ae81ff;
}
.CodeMirror-lines span.cm-number {
  color: #ae81ff;
}
.CodeMirror-lines span.cm-property,
.cm-s-monokai span.cm-attribute {
  color: #a6e22e;
}
.CodeMirror-lines span.cm-keyword {
  color: #f92672;
}
.CodeMirror-lines span.cm-string {
  color: #e6db74;
}
.CodeMirror-lines span.cm-variable {
  color: #a6e22e;
}
.CodeMirror-lines span.cm-variable-2 {
  color: #9effff;
}
.CodeMirror-lines span.cm-def {
  color: #fd971f;
}
.CodeMirror-lines span.cm-error {
  background: #f92672;
  color: #f8f8f0;
}
.CodeMirror-lines span.cm-bracket {
  color: #f8f8f2;
}
.CodeMirror-lines span.cm-tag {
  color: #f92672;
}
.CodeMirror-matchingbracket-lines span.cm-link {
  color: #ae81ff;
}
.cm-s-monokai .CodeMirror-matchingbracket {
  text-decoration: underline;
  color: white !important;
}
.CodeMirror-lines {
  border-radius: 0.5rem;
  padding: 2.2rem;
}
div.input_area {
  border: 0;
}
div.cell.selected {
  border-radius: 0.5rem;
  border: thin solid #e9e9e9;
}