body {
    background-color: #191919;
    color: #a1a1a1;
    font-family: 'Droid Sans', arial, serif;
    font-size: 14px;
}

#header {
    position: fixed;
    background-color: #191919;
    opacity: .7;
    color: #ccc;
    width: 100%;
    top: 0px;
    left: 0px;
    margin: 0px;
    padding: 4px 10px 4px 10px;
}

#main {
    margin-top: 100px;
}

#header b {
    font-weight: bold;
    color: #fff;
}

a {
    color: #999;
    text-decoration: underline;
}

a:hover {
    color: #fff;
}

#header .title {
    font-size: 400%;
}

#header .subtitle {
    font-size: 150%;
    margin-left: 1em;
    font-style: italic;
}

#header .nav {
    float: right;
    margin-right: 100px;
}

div.content {
    max-width: 850px;
    min-width: 675px;
    margin: auto;
}

div#tryit {
    min-width: 825px;
}

#splash {
    max-width: 700px;
}

.json {
    background-color: #333;
    padding: .5em 1em .5em 1em;
    border: 3px solid #444;
    border-radius: 1em;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
}

#splash .sample {
    width: 250px;
    float: right;
    margin-left: 1em;
    margin-top: 3em;
    font-size: 90%;
}

#doc {
    margin-top: 140px;
}

#doc table {
    width: 100%;
}

#doc table th {
    background-color: #aaa;
    color: #333;
    padding: 10px;
}

#doc table tr td:first-child {
    font-family: "andale mono",monospace;
}

#doc table td {
    padding-top: 3px;
}

#splash .sample tt {
    font-size: 90%;
    padding: 0 .2em 0 .2em;
}

#splash .sample pre {
    border-top: 1px dashed #aaa;
    padding-top: 1em;
}

#splash .pitch {
    padding-top: 2em;
    font-size: 170%;
}

.selected {
    opacity: .7;
    padding: 8px;
    margin: -10px;
    background-color: #fff475;
    color: #000;
    border: 2px solid white;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

div.current input, div.selector, pre, code, tt {
    font-family: "andale mono",monospace;
    font-size: .9em;
}

div.current {
    width: 100%;
    padding: 1em;
}

div.current input {
    color: #fff;
    font-size: 110%;
    background-color: #333;
    border: 1px solid #444;
    padding: 8px;
    width: 400px;
    margin-left: 1em;
    margin-right: 1em;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

pre.doc {
    float: right;
    padding: 1em 3em 1em 3em;
    padding-right: 160px;
    font-size: 90%;
}

.selectors {
    margin: 1em;
    background-color: #444;
    width: 300px;
    padding: 8px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;

}
.selectors .selector {
    background-color: #333;
    padding: .4em;
    margin: 1px;
    cursor: pointer;
}

.selectors .selector.inuse {
    border: 1px solid #9f9;
    margin: -1px;
    margin-left: 0px;
}

.results.error {
    color: #f99;
}

.results {
    color: #9f9;
    font-size: 90%;
    width: 300px;
}

#cred, #code {
    padding-top: 2em;
}

p.psst {
    margin-top: 4em;
    font-size: .9em;
}

p.item {
    margin-top: 2em;
    margin-left: 1em;
}