Personal Marked theme.

goblindegook.css

/* 
   This document has been created with Marked.app <http://markedapp.com>, Copyright 2011 Brett Terpstra
   Please leave this notice in place, along with any additional credits below.
   ---------------------------------------------------------------
   Title: goblindegook
   Author: Luís Rodrigues <https://github.com/goblindegook>
   Description: Personal Marked theme.
*/

body
{
    -webkit-font-smoothing:antialiased;
    font: normal 1em Lyon Text, Hoefler Text, Tisa Mobi Pro, Palatino, Georgia, serif;
    margin: 0;
    padding: 1em 1em 1em .25em;
    text-rendering:optimizeLegibility;
    line-height: 1.618;
}

h1, h2, h3
{
    color:#111;
    margin:1.618em 0 .809em;
}

h4, h5, h6
{
    color:#111;
    margin:.809em 0 .4em;
}

h1
{
    color:#000;
    line-height:1.2em;
    text-shadow: 0 1px 0 #ccc;
}

h2
{
    border-bottom:1px solid #ddd;
}

body,p,td,div
{
    color:#111;
    font-family: Lyon Text, Hoefler Text, Tisa Mobi Pro, Palatino, Georgia, serif;
    word-wrap:break-word;
}

h1:first-child,
h2:first-child,
h3:first-child
{
    margin-top:0;
}

h3, h4, h5, h6 {
    font-style: italic;
}

h3 em, h4 em, h5 em, h6 em,
h3 i, h4 i, h5 i, h6 i,
h3 cite, h4 cite, h5 cite, h6 cite
{
    font-style: normal;
}

a
{
    -webkit-transition: color .2s ease-in-out;
    color:#0d6ea1;
    text-decoration:none
}

a:hover
{
    color:#3593d9
}

blockquote
{
    border-left:3px solid #ddd;
    color:#777;
    margin: 1.618em auto 1.618em 5px;
    padding:0 0 0 15px;
    width:96%;
}

.footnote
{
    color:#0d6ea1;
    font-size:.8em;
    vertical-align:super
}

#wrapper img
{
    max-width:100%;
    height:auto
}

dl
{
}

dl dt
{
    font-weight:700;
    margin: .25px 0;
}

dl dd
{
    margin: .4em 0 .4em 1.618em;
}

dl dd:last-child,dl:last-child
{
    margin-bottom: 0;
}

ol, ul {
    padding-left: 0;
    margin-bottom: 1.618em;
}

ul ul, ul ol
{
    margin-bottom: .4em
}

li
{
    -webkit-hyphens: auto;
    text-align: justify;
    margin-left: 1.618em;
    margin-bottom: 0.25em;
}

li > p:first-child
{
    margin:0
}

li > p
{
    margin: .5em 0;
}

li > ol,li > ul
{
    padding-left: 0;
}

code {
    -webkit-border-radius:3px;
    background-color:#f8f8ff;
    border:1px solid #ddd;
    padding: 2px;
    line-height: 1.8;
}

pre code
{
    color: #000;
    display: block;
    padding: 1em;
    white-space: pre-wrap;
}

pre,code,tt
{
    font-family:Menlo, Consolas, Inconsolata, Monaco;
    font-size: 0.85em;
}

caption,col,colgroup,table,tbody,td,tfoot,th,thead,tr
{
    border-spacing:0
}

table
{
    border:1px solid rgba(0,0,0,0.25);
    border-collapse:collapse;
    border-spacing:0;
    display:table;
    empty-cells:hide;
    margin:1.618em auto;
    padding:3px 10px;
    table-layout:fixed;
    font-size: 0.85em;
}

caption
{
    display:table-caption;
    font-weight:700
}

col
{
    display:table-column
}

colgroup
{
    display:table-column-group
}

tbody
{
    display:table-row-group
}

tfoot
{
    display:table-footer-group
}

thead
{
    display:table-header-group
}

td,th
{
    display:table-cell;
    padding:3px 10px;
}

tr
{
    display:table-row
}

table th,table td
{
    font-size:1.1em;
    line-height:23px;
    padding:0 1em
}

table thead
{
    background:rgba(0,0,0,0.15);
    border:1px solid rgba(0,0,0,0.15);
    border-bottom:1px solid rgba(0,0,0,0.2)
}

table tbody
{
    background:rgba(0,0,0,0.05)
}

table tfoot
{
    background:rgba(0,0,0,0.15);
    border:1px solid rgba(0,0,0,0.15);
    border-top:1px solid rgba(0,0,0,0.2)
}

figure
{
    display:inline-block;
    margin-bottom:1.2em;
    position:relative;
    margin:1em 0
}

figcaption
{
    font-style:italic;    
    text-align:center;
    background:rgba(0,0,0,.9);
    color:rgba(255,255,255,1);
    position:absolute;
    left:0;
    bottom:-24px;
    width:98%;
    padding:1%;
    -webkit-transition:all .2s ease-in-out;
}

figure:hover>figcaption
{
    /* background:rgba(0,0,0,1) */
}

/* Styles used when "Tab-indented text is poetry" is set */
.poetry pre
{
    display:block;
    font-family:Georgia, Garamond, serif!important;
    font-size:110%!important;
    font-style:italic;
    line-height:1.6em;
    margin-left:1em
}

.poetry pre code
{
    font-family:Georgia, Garamond, serif!important
}

/* important rules for keeping line-height from being affected by sub */
sup,sub,a.footnote
{
    font-size:1.4ex;
    height:0;
    line-height:1;
    position:relative;
}

sup {
    vertical-align:super;
}

sub {
    vertical-align: sub;
    top: -1px;
}

p
{
    -webkit-hyphens:auto;
    margin:0;
    text-align:justify;
}

p + p
{
    text-indent:1.618em;
}

dt,th
{
    font-weight:700
}

table tr:nth-child(odd),table th:nth-child(odd),table td:nth-child(odd)
{
    background:rgba(255,255,255,0.06)
}

table tr:nth-child(even),table td:nth-child(even)
{
    background:rgba(0,0,0,0.06)
}

@media print {
    /* print only styles. Keep it clean */
    body
    {
        overflow:auto
    }
    img, pre, blockquote, table, figure, p {
        page-break-inside: avoid
    }
    .footnotes { page-break-before: always }

    #wrapper
    {
        background:#fff;
        color:#303030;
        font-size:85%;
        padding:10px;
        position:relative;
        text-indent:0
    }
}

@media screen {
    /* Screen-only styles, including inverted styles */
    .inverted #wrapper,
    .inverted {
        background:rgba(37, 42, 42, 1)
    }
    .inverted hr {
        border-color: rgba(51, 63, 64, 1) !important;
    }
    .inverted p,
    .inverted td,
    .inverted li,
    .inverted h1,
    .inverted h2,
    .inverted h3,
    .inverted h4,
    .inverted h5,
    .inverted h6,
    .inverted pre,
    .inverted code,
    .inverted th,
    .inverted .math,
    .inverted caption,
    .inverted dd,
    .inverted dt
    {
        color:#eee!important
    }
    .inverted table tr:nth-child(odd),
    .inverted table th:nth-child(odd),
    .inverted table td:nth-child(odd) {
      background: none;
    }
    .inverted a
    {
        color:rgba(172, 209, 213, 1);
    }

    #wrapper
    {
        padding: 20px
    }

    /* styles for more colorful selection highlights */
    ::selection { background:rgba(157, 193, 200,.5)}
    h1::selection { background-color:rgba(45, 156, 208, .3)}
    h2::selection { background-color:rgba(90, 182, 224, .3)}
    h3::selection,
    h4::selection,
    h5::selection,
    h6::selection,li::selection,ol::selection { background-color:rgba(133, 201, 232, .3)}
    code::selection { background-color:rgba(0,0,0,.7);color:#eee}
    code span::selection {background-color:rgba(0,0,0,.7) !important;color:#eee !important}
    a::selection { background-color:rgba(255, 230, 102,.2)}
    .inverted a::selection { background-color:rgba(255, 230, 102,.6)}
    td::selection,th::selection,caption::selection { background-color: rgba(180, 237, 95, .5);}
}