body
{
    background-color: #eee; /* Applying here to style overscroll */
    font-family: "Lato", Arial, sans-serif;
    margin: 0;
    line-height: 1.6;
    color: #555;
    font-size: 16px;
    min-width: 480px;
}
main
{
    display: block;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#f9f9f9', endColorstr='#ffffff')"; /* IE 8-9 */
    background: linear-gradient(180deg, #f9f9f9 0%, #fff 250px);
    background-color: #fff; /* Real background color */
    overflow: hidden;
}

a
{
    color: #6690cc;
}
a:hover
{
    color: #4075bf;
}

p
{
    margin: 0.6em 0;
}

ul
{
    padding-left: 1.8em;
}

table
{
    border-collapse: collapse;
}
td
{
    vertical-align: top;
}
th
{
    vertical-align: top;
    text-align: left;
    font-weight: normal;
}

label
{
    display: block;
}

pre
{
    background-color: #f6f6f6;
    border-radius: 3px;
    padding: 3px 8px;
    overflow-x: auto;
}
pre > code
{
    padding: 0;
    background-color: transparent;
}

tt,
code,
span.setting,
span.command
{
    font-family: "Roboto Mono", monospace;
    font-size: 14px;
    background-color: #f3f3f3;
    border-radius: 2px;
    padding: 1px 5px;
}

input[type=text],
input[type=email],
input[type=number],
textarea
{
    font-family: "Lato", Arial, sans-serif;
    font-size: 16px;
    padding: 2px;
    border: 1px solid #ddd;
    -webkit-appearance: none;
    border-radius: 1px;
}
input[type=text],
input[type=email]
{
    width: 220px;
}
input[type=number]
{
    width: 50px;
}
textarea
{
    font-family: "Roboto Mono", monospace;
    font-size: 14px;
}
input[type=button],
input[type=submit]
{
    margin-top: 0.5em;
    display: inline-block;
    padding: 8px 15px;
    border-radius: 3px;
    color: #fff;
    background-color: #999;
    border: none;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor: pointer;
    -webkit-appearance: none;
    transition: background-color 0.15s ease-in-out;
    -webkit-transition: background-color 0.15s ease-in-out;
}
input[type=button]:hover,
input[type=submit]:hover
{
    background-color: #777;
}

h1
{
    font-size: 34px;
    line-height: 54px;
    font-weight: normal;
    margin-bottom: 0.5em;
    margin-top: 0.7em;
}
h1 span
{
    padding: 2px 10px 3px;
    background-color: rgba(0, 0, 0, 0.05);
    position: relative;
    left: -10px;
    color: #666;
    border-radius: 3px;
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}
h1 a,
h1 a:hover
{
    text-decoration: none;
    color: #555;
}
h2
{
    color: #777;
    font-size: 1.5em;
    font-weight: normal;
    margin-top: 1em;
    margin-bottom: 0.4em;
}
h1 + h2
{
    margin-top: 0.7em;
}
h2 a,
h2 a:hover
{
    text-decoration: none;
    color: #777;
}
h1 code,
h2 code,
h3 code,
h4 code
{
    font-size: 1em;
}

h3
{
    font-size: 1.2em;
    color: #777;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: normal;
    margin-top: 0.7em;
    margin-bottom: 0.4em;
}
h4
{
    font-size: 1.1em;
    color: #888;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: normal;
}

header > section,
footer > section,
main > section
{
    width: 1200px;
    margin: 0 auto;
    position: relative;
}
main > section
{
    width: 1140px;
    background-image: url(/images/icon_grey_top.svg);
    background-repeat: no-repeat;
    background-position: right 32px bottom 0;
    background-size: 256px auto;
    min-height: 350px;
    padding-bottom: 100px;
}
main > section:after
{
    content: "";
    display: table;
    clear: both;
}

div.primary
{
    float: left;
}
div.primary > section
{
    max-width: 800px;
}

header
{
    background-color: #4B4B4B;
    padding: 18px 0;
}

header > section:after
{
    content: "";
    display: table;
    clear: both;
}

header a#logo
{
    float: left;
}
header a#logo img
{
    width: 199px;
    height: 22px;
    display: block;
    border: none;
    transition: opacity 0.15s ease-in-out;
    -webkit-transition: opacity 0.15s ease-in-out;
}
header a#logo:hover img
{
    opacity: 0.8;
}

header nav
{
    float: right;
    line-height: 22px;
}

header nav a
{
    color: #fff;
    text-decoration: none;
    margin-left: 32px;
    display: inline-block;
    transition: color 0.15s ease-in-out;
    -webkit-transition: color 0.15s ease-in-out;
}

header nav a:hover
{
    color: #ddd;
}

header nav a:first-child
{
    margin-left: 0;
}

footer > section
{
    width: 1140px;
    padding: 20px 0;
    background-image: url(/images/icon_grey_bottom.svg);
    background-repeat: no-repeat;
    background-position: right 32px top 0;
    background-size: 256px auto;
    min-height: 128px;
}

aside
{
    float: left;
    max-width: calc(100% - 848px);
    margin-left: 48px;
    margin-bottom: 32px;
}
aside h3
{
    margin-bottom: 0.5em;
}
aside p
{
    margin: 0.5em 0;
}

main > section > section,
article
{
    max-width: 800px;
    clear: left;
}

kbd
{
    font-family: "Roboto Mono", monospace;
    background-color: #f3f3f3;
    color: #333;
    border-radius: 2px;
    padding: 1px 5px;
    font-size: 14px;
}

span.keys span.mouse
{
    font-style: italic;
}

span.keys i
{
    padding: 0 2px;
    font-style: normal;
}

span.keys b
{
    background-color: #f3f3f3;
    border-radius: 2px;
    padding: 1px 6px;
    border: 1px solid #ccc;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0.2), 0 0 0 1px #fff inset;
    display: inline-block;
    font-size: 0.9em;
    color: #444;
    font-weight: normal;
}

span.feature
{
    font-style: italic;
    color: #333;
}

span.file,
span.symbol
{
    font-family: "Roboto Mono", monospace;
    font-size: 14px;
    border-bottom: 1px dotted #aaa;
}

span.file b,
span.symbol b
{
    color: #333;
}

span.menu
{
    background-color: #f3f3f3;
    color: #333;
    border-radius: 2px;
    padding: 1px 5px;
}
span.menu i
{
    color: #aaa;
    font-style: normal;
    font-size: 0.6em;
    padding: 0 2px 0 3px;
    position: relative;
    top: -1px;
}

html.plat_linux span.keys.mac,
html.plat_windows span.keys.mac
{
    display: none;
}
html.plat_osx span.keys.pc
{
    display: none;
}

@media only screen and (max-width: 800px)
{
    header
    {
        padding: 15px 0;
    }
    header nav
    {
        float: none;
        clear: left;
        padding-top: 15px;
    }
    header nav a
    {
        margin-left: 20px;
    }
}
@media only screen and (max-width: 1160px)
{
    main > section
    {
        background-position: right 20px bottom 0;
        background-size: 192px auto;
    }
    footer > section
    {
        background-position: right 20px top 0;
        background-size: 192px auto;
        min-height: 112px;
    }
}
@media only screen and (max-width: 1240px)
{
    header > section,
    footer > section,
    main > section
    {
        box-sizing: border-box;
        padding-left: 20px;
        padding-right: 20px;
        max-width: 100%;
    }
}
@media only screen and (max-width: 1100px)
{
    aside
    {
        float: none;
        clear: both;
        max-width: 100%;
        margin: 0;
        padding: 20px 0;
    }
}

/**
 * General
 */

 p.note
 {
     color: #fff;
     padding: 0.5em 0 0.5em 1em;
     border-radius: 3px;
     background-color: #7a94b8;
     font-style: italic;
 }
 p.note a
 {
    color: #fff;
 }

/**
 * Homepage
 */
div#masthead
{
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#A9C8C8', endColorstr='#A8B3C2')"; /* IE 8-9 */
    background: linear-gradient(135deg, #A9C8C8 0%, #A8B3C2 100%);
    overflow: hidden;
}

div#masthead section
{
    width: 1200px;
    margin: 25px auto 0;
}
div#masthead section.screencast
{

}
div#masthead section.screencast div.wrap
{
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
    overflow: hidden;
}
/* These styles have the box corners follow the title bar corner radius
 * so that the box-shadow doesn't leave empty sharp corners. Percentages
 * are used so when the width is scaled for narrow viewports, the radius
 * is still correct. */
html.plat_osx div#masthead section.screencast div.wrap
{
    border-radius: 0.333% 0.333% 0 0 / 0.694% 0.694% 0 0;
}
html.plat_linux div#masthead section.screencast div.wrap
{
    border-radius: 0.5% 0.5% 0 0 / 1.042% 1.042% 0 0;
}

#anim_container
{
    position: relative;
    overflow: hidden;
}
#fallback
{
    position: relative;
    display: none;
}
#title-overlay
{
    padding-top: 13%;
    color: #fff;
    background-color: rgba(32, 32, 32, 0.8);
    top: 0;
    left: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    font-size: 2em;
    transition: opacity 0.2s ease-in-out;
    -webkit-transition: opacity 0.2s ease-in-out;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE 8 */
}
#title-overlay.show
{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100), progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#80202020', endColorstr='#80202020')"; /* IE 8 */
    opacity: 1;
}
#title-overlay div
{
    text-align: center;
    max-width: 896px; margin: 0 auto;
}
#title-overlay div span.feature
{
    color: #ddd;
}


div#masthead section div.tagline
{
    font-size: 34px;
    line-height: 50px;
    color: #fff;
    text-align: center;
    box-sizing: border-box;
    width: 100%;
}
div#masthead section div.tagline span
{
    padding: 0 10px 5px;
    background-color: rgba(0, 0, 0, 0.1);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    border-radius: 3px;
}

#screencast-title-bar
{
    width: 1200px;
    margin: 0 auto;
    display: block;
    height: 22px;
    background-color: rgba(32, 32, 32, 0.8);
}

html.plat_linux #screencast-title-bar
{
    height: 28px;
}
html.plat_windows #screencast-title-bar
{
    height: 30px;
}

canvas
{
    display: block;
}

section.screencast-meta
{
    width: auto;
    margin: 0 auto;
    padding: 10px 40px 15px;
    font-size: 0.9em;
    color: #777;
    background-color: #fff;
    min-height: 105px;
    max-width: 1200px;
    box-sizing: border-box;
    border-top: none;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);
    position: relative;
    background-image: none;
}
section.screencast-meta .captions > div > b
{
    display: block;
    margin-bottom: 5px;
}
section.screencast-meta .buttons
{
    position: absolute;
    right: 1px;
    top: 5px;
}
section.screencast-meta .buttons a
{
    text-decoration: none;
    color: #999;
    transition: color 0.15s ease-in-out;
    -webkit-transition: color 0.15s ease-in-out;
}
section.screencast-meta .buttons a:hover
{
    color: #666;
}
section.screencast-meta .buttons svg
{
    fill: currentColor;
    padding: 2px 4px;
}
section.screencast-meta .buttons #button-play
{
    display: none;
}
section.screencast-meta #indicators
{
    position: absolute;
    text-align: center;
    top: -3px;
    width: 100%;
}
section.screencast-meta a
{
    text-decoration: none;
    padding: 2px 4px;
    display: inline-block;
}
section.screencast-meta a .jump
{
    border-radius: 2px;
    background-color: #ccc;
    height: 4px;
    width: 35px;
    display: inline-block;
    transition: background-color 0.15s ease-in-out;
    -webkit-transition: background-color 0.15s ease-in-out;
}
section.screencast-meta a.active .jump
{
    background-color: #888;
}
section.screencast-meta a:hover .jump
{
    background-color: #666;
}

div#masthead div.download
{
    text-align: center;
    margin: 20px auto 0;
}
div.download div
{
    display: inline-block;
}
div.download .button
{
    padding-left: 20px;
}

div.download .button span
{
    display: none;
}
div.download .button a
{
    display: inline-block;
    background-color: #888;
    color: #fff;
    border-radius: 3px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    text-decoration: none;
    padding: 8px 15px;
    transition: background-color 0.15s ease-in-out;
    -webkit-transition: background-color 0.15s ease-in-out;
}
div.download .button a:hover
{
    background-color: #777;
}
div.download .current_version,
div.download .changelog
{
    margin-left: 20px;
    color: rgba(255, 255, 255, 0.8);
}
div.download .changelog
{
    padding-right: 20px;
}
div.download .changelog a
{
    color: rgba(255, 255, 255, 0.8);
}
html.plat_windows.arch_64 div.download .button span.win.show_64
{
    display: block;
}
html.plat_windows.arch_32 div.download .button span.win.show_32
{
    display: block;
}
html.plat_linux div.download .button span.linux
{
    display: block;
}
html.plat_osx div.download .button span.mac
{
    display: block;
}

div.feature
{
    float: left;
    width: 45%;
}
div.feature.odd
{
    clear: left;
    padding-left: 2.5%;
}
div.feature.even
{
    margin-left: 5%;
    padding-right: 2.5%;
}
div.feature h3
{
    margin-bottom: 0.5em;
}
div.feature p
{
    margin: 0.8em 0;
}

h2.love
{
    text-align: center;
    margin: 1.2em 0 0;
    font-size: 34px;
    line-height: 54px;
    font-weight: normal;
}
h2.love span
{
    padding: 2px 10px 3px;
    background-color: rgba(0, 0, 0, 0.05);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    border-radius: 3px;
}

@media only screen and (max-width: 800px)
{
    div.feature.odd,
    div.feature.even
    {
        float: none;
        width: auto;
        margin-left: 0;
        padding: 0;
    }
    div.download .button,
    div.download .current_version,
    div.download .changelog
    {
        display: block;
        padding: 0;
        margin: 0;
    }
    div.download .button
    {
        margin-bottom: 5px;
    }
    #title-overlay
    {
        font-size: 1.4em;
    }
    img
    {
        max-width: 100%;
        width: auto;
        height: auto;
    }
}
@media only screen and (max-width: 1000px)
{
    section.screencast-meta
    {
        padding-top: 20px;
    }
    #title-overlay
    {
        font-size: 1.6em;
    }
}
@media only screen and (max-width: 1240px)
{
    div#masthead section
    {
        /* Account for switch to border-box */
        width: 1240px;
        padding-top: 20px;
        box-sizing: border-box;
        padding-left: 20px;
        padding-right: 20px;
        max-width: 100%;
    }
    div#masthead section.screencast
    {
        padding-top: 0;
    }
    #screencast-title-bar
    {
        width: 100%;
        height: auto;
        box-sizing: border-box;
    }
    section.screencast-meta
    {
        width: auto;
        margin: 0 20px;
        padding-left: 20px;
        padding-right: 20px;
    }
    section.screencast-meta div.captions
    {
        max-width: 100%;
    }
    canvas
    {
        max-width: 100%;
    }
}

/**
 * Download pages
 */

div.release-date
{
    margin-top: -1em;
    font-style: italic;
    margin-bottom: 1em;
    font-size: 0.9em;
    color: #888;
}

div.downloads
{
    margin: 1em 0;
    background-color: #fff;
    border-radius: 3px;
    padding: 10px 15px 15px;
    border: 1px solid #ddd;
}
div.downloads *:first-child
{
    margin-top: 0;
}
div.downloads *:last-child
{
    margin-bottom: 0;
}

section#changelog article
{
    padding: 1em 1em 0.5em;
    border-top: 1px solid #ddd;
}
section#changelog article h3
{
    margin-top: 0;
}
section#changelog article.current
{
    border-left: 3px solid #A8B3C2;
}

p.eval,
p.beta,
p.windows-only
{
    font-style: italic;
    color: #777;
}

p.latest
{
    margin-bottom: 0;
    font-weight: bold;
    color: #777;
}

p.newer,
p.unmaintained
{
    font-size: 1.1em;
    color: #fff;
    padding: 0.5em 0 0.5em 1em;
    border-radius: 3px;
    background-color: #d69d5c;
}
p.unmaintained
{
    background-color: #bd7575;
}
p.newer a,
p.unmaintained a
{
    color: #fff;
}

#dl
{
    margin-top: 0.2em;
    list-style-type: circle;
}

html.plat_osx #dl_osx,
html.plat_linux #dl_linux,
html.plat_windows.arch_64 #dl_win_64,
html.plat_windows.arch_32 #dl_win_32
{
    list-style-type: disc;
    font-weight: bold;
}

#direct-downloads
{
    display: none;
}
#direct-downloads.show
{
    display: block;
}
#direct-downloads em,
#direct-downloads em a
{
    color: #777;
}

/**
 * Blog
 */

article.post h2
{
    margin-top: 1em;
}
aside + article.post h2
{
    margin-top: 0;
}
div.meta span
{
    display: inline-block;
    font-size: 0.9em;
    font-style: italic;
}

div.meta span.date
{
    color: #999;
}
div.meta span.author
{
    margin-right: 2em;
    color: #999;
}
div.meta span.by
{
    color: #aaa;
    margin-left: 0.3em;
    margin-right: 0.1em;
}
article.post div.meta
{
    margin-top: -1em;
    margin-bottom: 1em;
}
article.post
{
    border-top: 1px solid #ddd;
    margin-bottom: 2em;
}
aside + article.post
{
    border-top: none;
}
h1 + div.meta
{
    margin-top: -1.1em;
    margin-bottom: 1em;
}
div.rss
{
    padding-top: 20px;
    float: right;
    width: calc(100% - 848px);
    margin-bottom: 0;
}
a.rss img
{
    width: 16px;
    height: 16px;
    border: none;
    position: relative;
    bottom: -3px;
    padding-right: 5px;
    display: inline;
}
@media only screen and (max-width: 1100px)
{
    div.rss
    {
        width: auto;
        padding-right: calc(100% - 800px);
        float: right;
        box-sizing: border-box;
    }
    a.rss
    {
    }
}
@media only screen and (max-width: 840px)
{

}
aside section.archives h3
{
    margin-top: 0;
}
div.primary:after
{
    content: "";
    display: table;
    clear: both;
}
a.blog_nav.left
{
    padding-right: 10px;
}
a.blog_nav.left img
{
    padding-right: 3px;
}
a.blog_nav.right img
{
    padding-left: 3px;
}

/**
 * Buy
 */

form section
{
    background-color: #fff;
    border-radius: 3px;
    padding: 10px 15px 15px;
    border: 1px solid #ddd;
    width: 400px;
    margin: 1.5em 0;
}
form section > h3:first-child
{
    margin-top: 0;
}
form section *:last-child
{
    margin-bottom: 0;
}
form section h3
{
    margin-bottom: 0.3em;
    margin-top: 0.5em;
}

form table
{
    width: 100%;
}
form td,
form th
{
    padding: 2px 0;
}
form th
{
    padding-right: 10px;
}
form#f
{
    margin-top: 1.5em;
}
#buyform .price
{
    font-weight: bold;
}
#buyform .buttons
{
    margin-top: 0.5em;
}
#buyform .buttons .card
{
    background-color: #A8B3C2;
    margin-right: 0.5em;
}
#buyform .buttons .card:hover
{
    background-color: #8796ab;
}
#buyform .buttons .paypal
{
    background-color: #A8B3C2;
}
#buyform .buttons .paypal:hover
{
    background-color: #8796ab;
}
#quantity_section
{
    margin-top: 1em;
    margin-bottom: 1.8em;
}
#quantity_section table
{
    width: auto;
}
#quantity_section th
{
    padding-right: 10px;
}
#quantity_section tr.pricing
{
    font-size: 0.85em;
    color: #777;
    font-style: italic;
}
#quantity_section tr.pricing th
{
    text-align: right;
}

section.notes
{
    margin-top: 1.5em;
}
section.notes p
{
    font-size: 0.85em;
    font-style: italic;
    color: #777;
}

.license-for td
{
    padding-top: 10px;
}
.info_msg
{
    font-size: smaller;
    color: #777;
    font-style: italic;
}

pre.license_key
{
    margin: 1em 0;
    background-color: #fff;
    border-radius: 3px;
    padding: 10px 15px 15px;
    border: 1px solid #ddd;
}

/**
 * Docs
 */

body.docs h1
{
    margin-bottom: 1em;
}
body.docs h1 span
{
    position: relative;
    padding-top: 18px;
    top: 16px;
}
body.docs h1 span a
{
    font-size: 0.85rem;
    line-height: 1.2rem;
    top: 4px;
    left: 10px;
    color: #888;
    position: absolute;
    text-transform: uppercase;
}
body.docs.top-level h1
{
    margin-bottom: 0.5em;
}
body.docs.top-level h1 span
{
    padding-top: 2px;
    top: 0;
}

body.docs h2
{
    border-bottom: 1px dotted #ddd;
}

body.docs main > section > section.wide
{
    max-width: none;
    overflow-x: auto;
}

div.column
{
    float: left;
    margin-right: 4em;
    margin-bottom: 1em;
}
div.column:last-child
{
    margin-left: 0;
}
div.column h3
{
    margin-top: 0;
}

div.column.half
{
    margin-right: 4%;
    width: 48%;
}
div.column.half.odd
{
    clear: left;
}
div.column.half.even
{
    margin-right: 0;
}

@media (max-width: 1024px)
{
    div.column,
    div.column.half,
    div.column.half.odd,
    div.column.half.even
    {
        clear: none;
        float: none;
        margin: 0;
        width: auto;
    }
}

table.api
{
    padding-top: 1em;
    width: 100%;
    border-spacing: 0;
    margin-bottom: 1em;
    line-height: 1.2;
}

table.api th
{
    background-color: #eee;
    padding: 5px 6px;
    text-align: left;
    vertical-align: top;
}

table.api th:first-child
{
    width: 30%;
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px;
}
table.api th:last-child
{
    width: 56%;

    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
}

table.api td
{
    padding: 5px 6px;
    vertical-align: top;
    font-size: 0.9em;
    line-height: 1.4;
    border-bottom: solid 1px #ddd;
}

table.api td.mth,
table.api td.rtn
{
    font-family: "Roboto Mono", monospace;
}
table.api td.dsc tt,
table.api td.dsc code
{
    font-size: 14px;
}
table.api td.dsc p:first-child
{
    margin-top: 0;
}

dl.enum
{
    margin-left: 20px;
    max-width: 800px;
    line-height: 1.4;
}
a.properties,
a.attributes
{
    display: block;
    margin: 5px 0 0 20px;
}
dl.enum.properties,
dl.enum.attributes,
dl.enum.settings
{
    background-color: #fbfbfb;
    border: 1px solid #eee;
    padding: 12px 18px
}
dl.properties dd > code,
dl.attributes dd > code,
dl.enum.properties dd > code,
dl.enum.attributes dd >code,
dl.enum.settings dd > code
{
    background-color: #ececec;
}
/* clear children */
dl.enum:after,
dl.enum dl:after
{
    content: "";
    display: table;
    clear: both;
}

dl.enum dt
{
    display: block;
    margin: 12px 0 8px 0;
    background: none;
    border-bottom: 1px solid #ccc;
    float: left;
    clear: left;
    color: #222;
}
dl.enum dt:first-child,
dl.enum dt + dt
{
    margin-top: 0;
}
dl.enum dt:last-child
{
    margin-bottom: 0;
}
dl.enum dt em,
dl.enum dd code em
{
    opacity: 0.6;
}
dl.enum dd
{
    clear: left;
    margin-left: 25px;
}
dl.enum dd p:first-child
{
    margin-top: 0;
}
dl.enum dd p,
dl.enum dd ul
{
    margin: 0.5em 0;
}
dl.enum dd h4
{
    margin: 0.5em 0 0 0;
    font-weight: normal;
    font-style: italic;
}
dl.enum dd div.example
{
    font-style: italic;
    border-left: 1px solid #ddd;
    padding-left: 10px;
}
dl.enum dd dl
{
    margin: 10px 0 5px 20px;
    background-color: #fbfbfb;
    border: 1px solid #eee;
    padding: 12px 18px;
}
dl.enum dd dl dt
{
    margin: 5px 0 0 0;
}
dl.enum dd dl dt a
{
    font-family: "Lato", Arial, sans-serif;;
    font-size: 1rem;
    text-decoration: none;
}
dl.repositories dt
{
    margin-left: 20px;
    font-weight: bold;
    color: #777;
}
dl.repositories dd
{
    margin-left: 20px;
}
dl.repositories dd pre
{
    margin-top: 8px;
    white-space: pre-wrap;
}

pre.gpg-key,
pre.install
{
    margin-left: 20px;
    white-space: pre-wrap;
}

table.settings
{
    border-spacing: 8px 8px;
}

table.settings td
{
    vertical-align: top;
    border-spacing: 8px 8px;
}
table.settings td.setting
{
    font-family: "Roboto Mono", monospace;
    font-size: 14px;
    padding-right: 1em;
}

table.controls
{
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #ddd;
}
table.controls.min
{
    width: auto;
}
table.controls.min th,
table.controls.min td
{
    padding-left: 25px;
    padding-right: 25px;
}
table.controls th,
table.controls td
{
    padding: 4px 5px;
    text-align: center;
    border-left: 1px solid #ddd;
}
table.controls th:first-child,
table.controls td:first-child
{
    border-left: none;
}
table.controls thead
{
    border-bottom: 1px solid #ddd;
}
table.controls thead th
{
    background-color: #f3f3f3;
    font-weight: bold;
}
table.controls th.platform
{
    color: #777;
    font-size: 0.9em;
    font-style: italic;
    padding-bottom: 0;
}
table.controls td.keys
{
    padding-bottom: 8px;
}
table.controls tr.command td.keys
{
    padding-top: 8px;
}
table.controls th.command
{
    vertical-align: middle;
}
table.controls tr.command td,
table.controls tr.command th
{
    border-bottom: 1px solid #ddd;
}
table.controls tr.command:last-child td,
table.controls tr.command:last-child th
{
    border-bottom: none;
}
table.controls td.menu,
table.controls td.palette
{
    vertical-align: middle;
}

/* CSS for prism.js */

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: #777;
}

.token.punctuation {
    color: #444;
}

.token.null,
.token.operator,
.token.boolean {
    color: #ba8baf;
}
.token.property {
    color: #3c97dd;
}
.token.number,
.token.tag {
    color: #d2322d;
}
.token.string {
    color: #9dbf40;
}
.token.selector {
    color: #ba8baf;
}
.token.attr-name {
    color: #f09642;
}
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
    color: #9dbf40;
}

.token.attr-value,
.token.keyword,
.token.control,
.token.directive,
.token.unit {
    color: #9dbf40;
}

.token.statement,
.token.regex,
.token.atrule {
    color: #9dbf40;
}

.token.placeholder,
.token.variable {
    color: #3c97dd;
}

.token.important {
    color: #d2322d;
    font-weight: bold;
}

.token.entity {
    cursor: help;
}