IPython notebook.css

<style type="text/css">
/*!
* IPython notebook
*
*/
.ansibold {
    font-weight: 700
}

.ansiblack {
    color: #000
}

.ansired {
    color: #8b0000
}

.ansigreen {
    color: #006400
}

.ansiyellow {
    color: #c4a000
}

.ansiblue {
    color: #00008b
}

.ansipurple {
    color: #9400d3
}

.ansicyan {
    color: #4682b4
}

.ansigray {
    color: gray
}

.ansibgblack {
    background-color: #000
}

.ansibgred {
    background-color: red
}

.ansibggreen {
    background-color: green
}

.ansibgyellow {
    background-color: #ff0
}

.ansibgblue {
    background-color: #00f
}

.ansibgpurple {
    background-color: #ff00ff
}

.ansibgcyan {
    background-color: #0ff
}

.ansibggray {
    background-color: gray
}

div.cell {
    border: 1px solid transparent;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    border-radius: 2px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    border-width: thin;
    border-style: solid;
    width: 100%;
    padding: 5px;
    margin: 0;
    outline: 0
}

div.cell.selected {
    border-color: #ababab
}

@media print {
    div.cell.selected {
        border-color: transparent
    }
}

.edit_mode div.cell.selected {
    border-color: green
}

.prompt {
    padding: .4em;
    margin: 0;
    font-family: monospace;
    text-align: right;
    line-height: 1.21429em
}

div.inner_cell {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    flex: 1
}

@-moz-document url-prefix() {
    div.inner_cell {
        overflow-x: auto
    }
}

div.input_area {
    border: 1px solid #cfcfcf;
    border-radius: 2px;
    background: #f7f7f7;
    line-height: 1.21429em
}

div.prompt:empty {
    padding-top: 0;
    padding-bottom: 0
}

div.unrecognized_cell {
    padding: 5px 5px 5px 0;
    display: -webkit-box;
    -webkit-box-orient: horizontal;
    display: -moz-box;
    -moz-box-orient: horizontal;
    display: box;
    box-orient: horizontal;
    box-align: stretch;
    display: flex;
    flex-direction: row;
    align-items: stretch
}

div.unrecognized_cell .inner_cell {
    border-radius: 2px;
    padding: 5px;
    font-weight: 700;
    color: red;
    border: 1px solid #cfcfcf;
    background: #eaeaea
}

div.unrecognized_cell .inner_cell a,div.unrecognized_cell .inner_cell a:hover {
    color: inherit;
    text-decoration: none
}

@media (max-width: 540px) {
    .prompt {
        text-align:left
    }

    div.unrecognized_cell>div.prompt {
        display: none
    }
}

div.code_cell {
}

div.input {
    page-break-inside: avoid;
    display: -webkit-box;
    -webkit-box-orient: horizontal;
    display: -moz-box;
    -moz-box-orient: horizontal;
    display: box;
    box-orient: horizontal;
    box-align: stretch;
    display: flex;
    flex-direction: row;
    align-items: stretch
}

@media (max-width: 540px) {
    div.input {
        -webkit-box-orient:vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
        box-align: stretch;
        display: flex;
        flex-direction: column;
        align-items: stretch
    }
}

div.input_prompt {
    color: navy;
    border-top: 1px solid transparent
}

div.input_area>div.highlight {
    margin: .4em;
    border: none;
    padding: 0;
    background-color: transparent
}

div.input_area>div.highlight>pre {
    margin: 0;
    border: none;
    padding: 0;
    background-color: transparent
    white-space: pre-wrap
}

.CodeMirror {
    line-height: 1.21429em;
    font-size: 14px;
    height: auto;
    background: 0 0
}

.CodeMirror-scroll {
    overflow-y: hidden;
    overflow-x: auto
}

.CodeMirror-lines {
    padding: .4em
}

.CodeMirror-linenumber {
    padding: 0 8px 0 4px
}

.CodeMirror-gutters {
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px
}

.CodeMirror pre {
    padding: 0;
    border: 0;
    border-radius: 0
}

.highlight-base,.highlight-variable {
    color: #000
}

.highlight-variable-2 {
    color: #1a1a1a
}

.highlight-variable-3 {
    color: #333
}

.highlight-string {
    color: #BA2121
}

.highlight-comment {
    color: #408080;
    font-style: italic
}

.highlight-number {
    color: #080
}

.highlight-atom {
    color: #88F
}

.highlight-keyword {
    color: green;
    font-weight: 700
}

.highlight-builtin {
    color: green
}

.highlight-error {
    color: red
}

.highlight-operator {
    color: #A2F;
    font-weight: 700
}

.highlight-meta {
    color: #A2F
}

.highlight-def {
    color: #00f
}

.highlight-string-2 {
    color: #f50
}

.highlight-qualifier {
    color: #555
}

.highlight-bracket {
    color: #997
}

.highlight-tag {
    color: #170
}

.highlight-attribute {
    color: #00c
}

.highlight-header {
    color: #00f
}

.highlight-quote {
    color: #090
}

.highlight-link {
    color: #00c
}

.cm-s-ipython span.cm-keyword {
    color: green;
    font-weight: 700
}

.cm-s-ipython span.cm-atom {
    color: #88F
}

.cm-s-ipython span.cm-number {
    color: #080
}

.cm-s-ipython span.cm-def {
    color: #00f
}

.cm-s-ipython span.cm-variable {
    color: #000
}

.cm-s-ipython span.cm-operator {
    color: #A2F;
    font-weight: 700
}

.cm-s-ipython span.cm-variable-2 {
    color: #1a1a1a
}

.cm-s-ipython span.cm-variable-3 {
    color: #333
}

.cm-s-ipython span.cm-comment {
    color: #408080;
    font-style: italic
}

.cm-s-ipython span.cm-string {
    color: #BA2121
}

.cm-s-ipython span.cm-string-2 {
    color: #f50
}

.cm-s-ipython span.cm-meta {
    color: #A2F
}

.cm-s-ipython span.cm-qualifier {
    color: #555
}

.cm-s-ipython span.cm-builtin {
    color: green
}

.cm-s-ipython span.cm-bracket {
    color: #997
}

.cm-s-ipython span.cm-tag {
    color: #170
}

.cm-s-ipython span.cm-attribute {
    color: #00c
}

.cm-s-ipython span.cm-header {
    color: #00f
}

.cm-s-ipython span.cm-quote {
    color: #090
}

.cm-s-ipython span.cm-link {
    color: #00c
}

.cm-s-ipython span.cm-error {
    color: red
}

.cm-s-ipython span.cm-tab {
    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAMCAYAAAAkuj5RAAAAAXNSR0IArs4c6QAAAGFJREFUSMft1LsRQFAQheHPowAKoACx3IgEKtaEHujDjORSgWTH/ZOdnZOcM/sgk/kFFWY0qV8foQwS4MKBCS3qR6ixBJvElOobYAtivseIE120FaowJPN75GMu8j/LfMwNjh4HUpwg4LUAAAAASUVORK5CYII=')right no-repeat
}

div.output_wrapper {
    display: -webkit-box;
    -webkit-box-align: stretch;
    display: -moz-box;
    -moz-box-align: stretch;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    z-index: 1
}

div.output_scroll {
    height: 24em;
    width: 100%;
    overflow: auto;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 2px 8px rgba(0,0,0,.8);
    box-shadow: inset 0 2px 8px rgba(0,0,0,.8);
    display: block
}

div.output_collapsed {
    margin: 0;
    padding: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch
}

div.out_prompt_overlay {
    height: 100%;
    padding: 0 .4em;
    position: absolute;
    border-radius: 2px
}

div.out_prompt_overlay:hover {
    -webkit-box-shadow: inset 0 0 1px #000;
    box-shadow: inset 0 0 1px #000;
    background: rgba(240,240,240,.5)
}

div.output_prompt {
    color: #8b0000
}

div.output_area {
    padding: 0;
    page-break-inside: avoid;
    display: -webkit-box;
    -webkit-box-orient: horizontal;
    display: -moz-box;
    -moz-box-orient: horizontal;
    display: box;
    box-orient: horizontal;
    box-align: stretch;
    display: flex;
    flex-direction: row;
    align-items: stretch
}

div.output_area .MathJax_Display {
    text-align: left!important
}

div.output_area .rendered_html img,div.output_area .rendered_html table {
    margin-left: 0;
    margin-right: 0
}

div.output_area img,div.output_area svg {
    max-width: 100%
}

div.output_area img.unconfined,div.output_area svg.unconfined {
    max-width: none
}

.output {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    display: -moz-box;
    -moz-box-orient: vertical;
    display: box;
    box-orient: vertical;
    box-align: stretch;
    display: flex;
    flex-direction: column;
    align-items: stretch
}

@media (max-width: 540px) {
    div.output_area {
        -webkit-box-orient:vertical;
        -moz-box-orient: vertical;
        box-orient: vertical;
        box-align: stretch;
        display: flex;
        flex-direction: column;
        align-items: stretch
    }
}

div.output_area pre {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    color: #000;
    background-color: transparent;
    border-radius: 0
}

div.output_subarea {
    overflow-x: auto;
    padding: .4em;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    box-flex: 1;
    flex: 1
}

div.output_text {
    text-align: left;
    color: #000;
    line-height: 1.21429em
}

div.output_stderr {
    background: #fdd
}

div.output_latex {
    text-align: left
}

div.output_javascript:empty {
    padding: 0
}

.js-error {
    color: #8b0000
}

div.raw_input_container {
    font-family: monospace;
    padding-top: 5px
}

span.raw_input_prompt {
}

input.raw_input {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    width: auto;
    vertical-align: baseline;
    padding: 0 .25em;
    margin: 0 .25em
}

input.raw_input:focus {
    box-shadow: none
}

p.p-space {
    margin-bottom: 10px
}

div.output_unrecognized {
    padding: 5px;
    font-weight: 700;
    color: red
}

div.output_unrecognized a,div.output_unrecognized a:hover {
    color: inherit;
    text-decoration: none
}

.rendered_html {
    color: #000
}

.rendered_html em {
    font-style: italic
}

.rendered_html strong {
    font-weight: 700
}

.rendered_html :link,.rendered_html :visited,.rendered_html u {
    text-decoration: underline
}

.rendered_html h1 {
    font-size: 185.7%;
    margin: 1.08em 0 0;
    font-weight: 700;
    line-height: 1
}

.rendered_html h2 {
    font-size: 157.1%;
    margin: 1.27em 0 0;
    font-weight: 700;
    line-height: 1
}

.rendered_html h3 {
    font-size: 128.6%;
    margin: 1.55em 0 0;
    font-weight: 700;
    line-height: 1
}

.rendered_html h4 {
    font-size: 100%;
    margin: 2em 0 0;
    font-weight: 700;
    line-height: 1
}

.rendered_html h5,.rendered_html h6 {
    font-size: 100%;
    margin: 2em 0 0;
    font-weight: 700;
    line-height: 1;
    font-style: italic
}

.rendered_html h1:first-child {
    margin-top: .538em
}

.rendered_html h2:first-child {
    margin-top: .636em
}

.rendered_html h3:first-child {
    margin-top: .777em
}

.rendered_html h4:first-child,.rendered_html h5:first-child,.rendered_html h6:first-child {
    margin-top: 1em
}

.rendered_html ul {
    list-style: disc;
    margin: 0 2em;
    padding-left: 0
}

.rendered_html ul ul {
    list-style: square;
    margin: 0 2em
}

.rendered_html ul ul ul {
    list-style: circle;
    margin: 0 2em
}

.rendered_html ol {
    list-style: decimal;
    margin: 0 2em;
    padding-left: 0
}

.rendered_html ol ol {
    list-style: upper-alpha;
    margin: 0 2em
}

.rendered_html ol ol ol {
    list-style: lower-alpha;
    margin: 0 2em
}

.rendered_html ol ol ol ol {
    list-style: lower-roman;
    margin: 0 2em
}

.rendered_html ol ol ol ol ol {
    list-style: decimal;
    margin: 0 2em
}

.rendered_html *+ol,.rendered_html *+ul {
    margin-top: 1em
}

.rendered_html hr {
    color: #000;
    background-color: #000
}

.rendered_html pre {
    margin: 1em 2em
}

.rendered_html code,.rendered_html pre {
    border: 0;
    background-color: #fff;
    color: #000;
    font-size: 100%;
    padding: 0
}

.rendered_html blockquote {
    margin: 1em 2em
}

.rendered_html table {
    margin-left: auto;
    margin-right: auto;
    border: 1px solid #000;
    border-collapse: collapse
}

.rendered_html td,.rendered_html th,.rendered_html tr {
    border: 1px solid #000;
    border-collapse: collapse;
    margin: 1em 2em
}

.rendered_html td,.rendered_html th {
    text-align: left;
    vertical-align: middle;
    padding: 4px
}

.rendered_html th {
    font-weight: 700
}

.rendered_html *+table {
    margin-top: 1em
}

.rendered_html p {
    text-align: left
}

.rendered_html *+p {
    margin-top: 1em
}

.rendered_html img {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.rendered_html *+img {
    margin-top: 1em
}

.rendered_html img,.rendered_html svg {
    max-width: 100%
}

.rendered_html img.unconfined,.rendered_html svg.unconfined {
    max-width: none
}

div.text_cell {
    display: -webkit-box;
    -webkit-box-orient: horizontal;
    display: -moz-box;
    -moz-box-orient: horizontal;
    display: box;
    box-orient: horizontal;
    box-align: stretch;
    display: flex;
    flex-direction: row;
    align-items: stretch
}

@media (max-width: 540px) {
    div.text_cell>div.prompt {
        display:none
    }
}

div.text_cell_render {
    outline: 0;
    resize: none;
    width: inherit;
    border-style: none;
    padding: .5em .5em .5em .4em;
    color: #000;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box
}

a.anchor-link:link {
    text-decoration: none;
    padding: 0 20px;
    visibility: hidden
}

h1:hover .anchor-link,h2:hover .anchor-link,h3:hover .anchor-link,h4:hover .anchor-link,h5:hover .anchor-link,h6:hover .anchor-link {
    visibility: visible
}

.text_cell.rendered .input_area {
    display: none
}

.text_cell.rendered .rendered_html {
    overflow-x: auto
}

.text_cell.unrendered .text_cell_render {
    display: none
}

.cm-header-1,.cm-header-2,.cm-header-3,.cm-header-4,.cm-header-5,.cm-header-6 {
    font-weight: 700;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif
}

.cm-header-1 {
    font-size: 185.7%
}

.cm-header-2 {
    font-size: 157.1%
}

.cm-header-3 {
    font-size: 128.6%
}

.cm-header-4 {
    font-size: 110%
}

.cm-header-5,.cm-header-6 {
    font-size: 100%;
    font-style: italic
}
</style>