/* start fonts */
body, input, textarea, select, #subtitle {
    font-family: 'Ubuntu', sans-serif;
}
h1, h2, h3, h4, h5, h6, #logo, #nav {
    font-family: 'Museo Slab', sans-serif;
}
pre, tt {
    font-family: 'Consolas', 'Menlo', monospace;
}

body {
    margin: 0;
    padding: 0;
    font-size: 1em;
/*    -moz-font-variant-numeric: proportional-nums oldstyle-nums;*/
/*    -moz-font-feature-settings: 'onum=1';*/
    line-height: 1.4;
}

/* Titles */
h1, h2, h3, h4, h5, h6 {
    margin: 1em 0 .5em 0;
    line-height: 1.2;
    font-weight: lighter;
    font-style: normal;
}
h1 {
    font-size: 1.75em;
}
h2 {
    font-size: 1.5em;
}
h3 {
    font-size: 1.25em;
}
h4 {
    font-size: 1em;
}
/* end fonts */

/* start colors */
body,
.comment_list > ol li > span { /* Reset color for comments. */
    color: hsl(196, 20%, 70%);
}
a {
    color: hsl(84, 50%, 50%);
}

#logo a, #nav a,
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: hsl(196, 20%, 90%);
}

/* Hover, focus, active links */
a:hover, a:focus, a:active,
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
h1 a:focus, h2 a:focus, h3 a:focus, h4 a:focus, h5 a:focus, h6 a:focus,
h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active {
    color: hsl(84, 70%, 70%);
}
#nav a:hover, #nav a:active, #nav a:link.active, #nav a:visited.active {
    color: hsl(84, 50%, 50%);
}

input, textarea, select {
    color: hsl(196, 20%, 90%);
}
input[type=submit] {
	color: hsl(84, 70%, 50%);
}

.post > .post_date, .post > .post_meta,
.post > .post_meta a:link, .post > .post_meta a:visited,
.comment_list > ol,
.comment_list > ol li span p.header,
.form_help, .error ul {
    color: hsl(196, 20%, 40%);
}
.post > .post_meta a:hover, .post > .post_meta a:hover,
.post > .post_meta a:focus, .post > .post_meta a:focus,
.post > .post_meta a:active, .post > .post_meta a:active {
    color: hsl(196, 20%, 60%);
}

/* backgrounds */
body {
    background: hsl(196, 20%, 20%);
    background: -moz-linear-gradient(top,
        hsl(196, 20%, 10%), hsl(196, 20%, 20%) 15em);
    /*background: -webkit-linear-gradient(top,
        hsl(196, 20%, 10%), hsl(196, 20%, 20%) 15em);*/
    background: linear-gradient(top,
        hsl(196, 20%, 10%), hsl(196, 20%, 20%) 15em);
}
input, textarea, select {
	background: hsl(196, 20%, 22%);
}
input:focus, input:hover, textarea:focus, textarea:hover {
	background: hsl(196, 20%, 25%);
}
input[type=submit] {
    background: -moz-linear-gradient(top,
        hsl(196, 20%, 25%), hsl(196, 20%, 15%) 100%);
    /*background: -webkit-linear-gradient(top,
        hsl(196, 20%, 25%), hsl(196, 20%, 15%) 100%);*/
    background: linear-gradient(top,
        hsl(196, 20%, 25%), hsl(196, 20%, 15%) 100%);
}
input[type=submit]:focus, input[type=submit]:hover {
    background: -moz-linear-gradient(top,
        hsl(196, 20%, 28%), hsl(196, 20%, 18%) 100%);
    /*background: -webkit-linear-gradient(top,
        hsl(196, 20%, 28%), hsl(196, 20%, 18%) 100%);*/
    background: linear-gradient(top,
        hsl(196, 20%, 28%), hsl(196, 20%, 18%) 100%);
}
div.highlight, pre.literal-block {
    background: hsl(196, 20%, 15%);
}

/* Form errors */
.errorlist li {
    color: hsl(0, 100%, 75%);
}
.error input, .error textarea {
    border-color: hsl(0, 100%, 75%);
}
/* end colors */

/* start borders */
input, textarea, select,
div.highlight, pre.literal-block, .rounded {
    margin: 0;
	border: 1px solid hsl(196, 20%, 35%);
	border-radius: 0.2em;
}

/* Fancy borders for grouped form elements. */
.box input:first-of-type, td input:first-of-type {
    border-right: none;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.box input:last-of-type, td input:last-of-type {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.box input:only-of-type, td input:only-of-type {
    border: 1px solid hsl(196, 20%, 35%);
	border-radius: 0.2em;
}

#footer, .pagination-bottom {
    border-top: 1px solid hsl(196, 20%, 35%);
}

#subtitle, #sidebar .box, .post, .category, .comment_list,
.pagination-top .clearboth {
	border-bottom: 1px solid hsl(196, 20%, 35%);
}

blockquote, .comment_list > ol li > span {
    border-left: 1px solid hsl(196, 20%, 35%);
}

#lastfm div {
    border: 1px solid hsl(196, 20%, 40%);
    border-radius: 0.175em;
}
#lastfm div:active, #lastfm div:hover {
    border-color: hsl(196, 20%, 60%);
}
/* end borders */

/* start misc_styles */
/* Links */
a,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none;
}
a:hover, a:focus, a:active
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
h1 a:focus, h2 a:focus, h3 a:focus, h4 a:focus, h5 a:focus, h6 a:focus,
h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active {
    text-decoration: underline;
}
a img {
    border: none;
}

/* Paragraphs and lists */
p, ul, ol, dl, table {
    margin: .75em 0; /* Most browser defaults are '1em 0'. */
    padding: 0;
}
dt {
    margin-top: .75em;
}
dd {
    margin: .25em 0;
}
ul, ol, dd {
    margin-left: 2em;
}
ul {
    list-style: disc;
}
td {
    padding: 0 .25em .25em 0;
    vertical-align: top;
}

/* Stopping superscript and subscript from augmenting the line's leading */
sup, sub {
    line-height: 0;
}

/* Forms */
form, fieldset {
    margin: 0;
    padding: 0;
    border: none;
}
input, button, select {
    vertical-align: middle;
}
input, textarea, select {
	font-size: .875em;
}
textarea, input[type=text], input[type=password] {
    padding: .125em .25em;
}
input[type=submit] {
	padding: .125em .75em;
}
/* Remove button padding in FF */
input::-moz-focus-inner {
    border: none;
    padding: 0;
}

/* Code */
pre { margin: 0.25em 0; }
div.highlight, pre.literal-block {
    font-size: .875em;
    margin: .3em .6em;
	padding: .25em;
	max-height: 15em;
	overflow: auto;
}
tt {
    border-bottom-width: 1px;
    border-bottom-style: dotted;
}

/* Make quotations more clearly visible */
blockquote {
    margin: .75em 0 .75em 1em;
    padding: 0 0 0 1em;
}
q, cite {
    font-style: italic;
}
q cite, q q {
    font-style: normal
}

/* Remove automatic quotation marks for inline quotations
   ('quotes:none' not working in Safari/Chrome) */
q:before, q:after {
    content: '';
}

/* Bring paragraphs inside lists or quotations closer */
blockquote p, li p {
    margin: .5em 0;
}

.aligncenter {text-align: center;}
div.aligncenter, table.aligncenter {margin: 0 auto;}
.alignleft { float: left; }
.alignright { float: right; }
.clearboth { clear: both; }
/* end misc_styles */

/* start containers */
#logo a {
    text-decoration: none;
}

#nav {
    text-transform: uppercase;
}

/* Bottom lines and pagination */
.pagination-bottom {
    margin-top: -1px; /* To remove double border line beneath .post. */
}
.pagination-top .clearboth, .pagination-bottom .clearboth {
    height: 0;
    overflow: hidden;
}
.pagination-top .clearboth {
    padding-bottom: .75em;
}
.pagination-bottom .alignleft, .pagination-bottom .alignright {
    padding: .75em 0 0 0;
}
.pagination-top .breadcrumbs, .pagination-bottom .breadcrumbs {
    padding: .5em 0;
}

/* Weblog posts and categories */
.category {
    padding-bottom: 1.25em;
}
.post {
    padding-bottom: 2em;
}
.post > .post_date, .post > .post_meta {
    font-size: 0.875em;
}
.post > .post_date {
    margin-top: -0.75em;
    margin-bottom: -0.5em;
}
.post > .post_meta a:link, .post > .post_meta a:visited {
    text-decoration: underline;
}
.category .category-name {
    float: left;
}
.category .feed-icon {
    float: left;
    margin: .5em 0 0 .375em;
    width: 16px;
    height: 16px;
    background-image: url(/media/feed-icons.png);
    background-repeat: no-repeat;
    background-position: 0px 0px;
}
.category .feed-icon:hover { background-position: -16px 0px; }
.category .feed-icon:active { background-position: -32px 0px; }
.category .feed-icon a {
    float: left;
    width: 16px;
    height: 0;
    padding-top: 16px;
    overflow: hidden;
}
.category p { clear: both; }

/* Forms */
#content input[type=text], textarea {
    width: 100%;
}
#content input[type=submit] {
    width: 25%;
}
.form_help, .error ul {
    font-size: 0.75em;
}
.form_help ul, .error ul {
    margin: 0 0 .25em 1.5em;
    padding: 0;
}

/* Comments (for weblog) */
.comment_list > ol {
    margin-left: 2em;
	font-size: 1.5em;
}
.comment_list > ol li { }
.comment_list > ol li > span {
    display: block;
    padding-left: .625em;
    padding-bottom: .625em;
	font-size: .625em;
}
.comment_list > ol li span p.header {
    margin: 0;
    padding: 0;
}

/* django-sphinxdoc */
.sphinx { padding-bottom: 2em; }
.sphinx h1 { font-size: 1.5em; }
.sphinx h2 { font-size: 1.25em; }
.sphinx a.headerlink {
    padding: 0 .25em 0 .25em;
    text-decoration: none;
    visibility: hidden;
}
.sphinx *:hover > a.headerlink { visibility: visible; }
.sphinx a.reference { text-decoration: none; }
.sphinx a.reference em { font-style: normal; }
.sphinx .descname { font-weight: bold; }

/* Sidebar */
#sidebar {
    font-size: .875em;
}
#sidebar input {
    font-size: 1em;
}
#sidebar .box {
    padding-bottom: .75em;
}
#sidebar .box h2 {
    margin-top: .75em;
}
#sidebar .box input[type=text] {
    width: 45%;
}
#sidebar ul {
    margin-left: 1.75em;
}
#sidebar ul ul {
    margin-top: 0;
    margin-bottom: 0;
}
#sidebar .social {
    display: inline-block;
    background-image: url('social.png');
    width: 32px;
    height: 32px;
    margin-top: 1.125em;
    margin-right: .5em;
}
#sidebar #rss {
    background-position: 0px 0px;
}
#sidebar #google_plus {
    background-position: -32px 0px;
}
#sidebar #bitbucket {
    background-position: -64px 0px;
}
#sidebar #github {
    background-position: -96px 0px;
}
#sidebar #paypal {
    display: inline-block;
    margin-top: .5em;
    margin-bottom: .5em;
}
#sidebar #paypal input {
    border: 0;
    background: none;
}

#lastfm {
    width: 200px;
    min-height: 184px;
    padding-bottom: .75em;
}
#lastfm div {
    width: 60px;
    height: 40px;
    overflow: hidden;
    float: left;
    margin: 0px 4px 4px 0px;
}
#lastfm img {
    width: 100%;
    min-height: 50px;
}

/* Footer */
#footer {
	padding-top: .25em;
	text-align: center;
	font-size: .875em;
}
#footer p {
	position: relative;
    top: -6px;  /* Align with Django pony */
	display: inline;
}
#footer span.sep {
	padding: 0 .35em;
}
/* end containers */