/* http://colorschemedesigner.com/#0331TE88ow0w0 */

@font-face {
    font-family: 'Crimson Text';
    src: url('/static/fonts/crimsontext-roman-webfont.eot');
    src: url('/static/fonts/crimsontext-roman-webfont.eot?#iefix') format('embedded-opentype'),
         url('/static/fonts/crimsontext-roman-webfont.woff') format('woff'),
         url('/static/fonts/crimsontext-roman-webfont.ttf') format('truetype'),
         url('/static/fonts/crimsontext-roman-webfont.svg#CrimsonTextRoman') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Crimson Text';
    src: url('/static/fonts/crimsontext-italic-webfont.eot');
    src: url('/static/fonts/crimsontext-italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('/static/fonts/crimsontext-italic-webfont.woff') format('woff'),
         url('/static/fonts/crimsontext-italic-webfont.ttf') format('truetype'),
         url('/static/fonts/crimsontext-italic-webfont.svg#CrimsonTextItalic') format('svg');
    font-style: italic;

}

@font-face {
    font-family: 'Crimson Text';
    src: url('/static/fonts/crimsontext-bold-webfont.eot');
    src: url('/static/fonts/crimsontext-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/static/fonts/crimsontext-bold-webfont.woff') format('woff'),
         url('/static/fonts/crimsontext-bold-webfont.ttf') format('truetype'),
         url('/static/fonts/crimsontext-bold-webfont.svg#CrimsonTextBold') format('svg');
    font-weight: bold;
}

.wf-loading {
    visibility: hidden;
}

.wf-active, .wf-inactive {
    visibility: visible;
}



/* Site styles */
body {
    font-family: 'Crimson Text', serif;
    font-size: 17px;
    line-height: 1.2;
    background: url('/static/images/textures/white_texture.png') repeat 0 0;
}

dl {
    line-height: 1.1;
}

dt {
    font-size: 21.327px;
    font-variant: small-caps;
}

dd {
    margin-bottom: 21.327px;
    margin-left: 13.197px;
}

header {
    color: #430300;
    text-align: center;
}

header h1 {
    font-size: 64px;
    margin-top: 20px;
    margin-bottom: 12px;
    padding-bottom: 0;
}

img, iframe {
    max-width: 100%;
}

pre {
    overflow-y: auto;
    background-color: rgba(60,60,60, 0.15);
    border-radius: 5px;
    padding: 5px;
    max-width: 100%;
    box-sizing: border-box;
}

header h1 small {
    font-size: 20px;
}

nav ul li {
    display: inline;
    margin-left: 55.693px;
}

nav ul li:first-child {
    margin-left: 0;
}

nav ul {
    list-style-type: none;
    border-bottom: 1px solid #bbb;
    margin-bottom: 0;
}

nav {
    font-size: 34.463px;
    margin-bottom: 55.693px;
    font-variant: small-caps;
}

nav .semimainnav {
    font-size: 21.327px;
    text-align: left;
}

nav a {
    color: #430300;
    text-decoration: none;
}

nav a:hover {
    color: #A13128;
    text-decoration: underline;
}

a {
    color: #268794;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
    color: #448A94;
}

code, pre {
    font-family: monospace;
    font-size: 12px;
}

footer {
    background: url('/static/images/textures/broken_noise.png') repeat 0 0;
    height: 90px;
    color: #ddd;
    width: 100%;
    text-align: center;
    padding-top: 5px;
    font-size: 13.197px;
    border-top: 1px solid #111;
}

footer p {
    margin-bottom: 3px;
}

footer a {
    color: #eee;
}

section {
  line-height: 1.3em;
}

section img {
    padding-top: 6px;
    margin-bottom: 60px;
    display: block;
}

/* Images with captions */
section figure {
  margin-bottom: 40px;
}

section figure img {
    margin-bottom: 6px;
}

section figure figcaption {
    font-size: 13.197px;
    font-style: italic;
}


section h1 {
    margin-bottom: 6px;
}

section p {
    font-size: 17px;
}

.everythingbutthefooter {
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -96px;
}


/* Front page */
.intro, section.intro p {
    color: #00171B;
    font-size: 21.327px;
}

.elsewhere {
    font-size: 21.327px;
    line-height: 1.5;
}

.elsewhere ul {
    list-style-type: none;
}

.elsewhere ul li {
    padding-left: 40px;
}

.elsewhere #twitter {
    background: url('/static/images/icons/twitterretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #lastfm {
    background: url('/static/images/icons/lastfmretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #tumblr {
    background: url('/static/images/icons/tumblrretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #spotify {
    background: url('/static/images/icons/spotifyretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #timj {
    background: url('/static/images/icons/timjicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #github {
    background: url('/static/images/icons/githubretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #instagram {
    background: url('/static/images/icons/instagramretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.elsewhere #twitch {
    background: url('/static/images/icons/twitchretinaicon.png') no-repeat 0 0;
    background-size: 30px;
}

.thingsmade {
    margin-top: 90px;
    line-height: 1.5;
    margin-bottom: 100px;
}

.thingsmade h1 {
    margin-bottom: 0;
}

.thingsmade li {
    font-size: 21.326px;
}

/* CV styles */
.cv h1 {
    margin-top: 55.563px;
}

.cv h2 {
    font-style: italic;
    font-weight: normal;
    font-size: 17px;
    margin-bottom: 0;
}

.cv ul {
    margin-bottom: 34.463px;
}


/* Blog styles */
.blogposts h1 a, .blognav a {
    color: #430300;
}

.blogposts h1 a:hover, .blognav a:hover {
    color: #A13128;
    text-decoration: underline;
}

.blogposts section {
    margin-bottom: 55.693px;
}

.blogposts .postdate {
    font-style: italic;
    color: #777;
}

.cta {
    border: 1px solid #AEA42E;
    background-color: #F9F2CA;
    padding: 10px;
    margin-bottom: 34.463px;
    text-align: center;
}

.warning {
    border: 1px solid #a13128;
    background-color: #f19f98;
    padding: 10px;
    margin-bottom: 34.463px;
}

.agewarning p {
    margin: 0;
    padding: 0;
}

.blognav h1 {
    font-size: 21.326px;
    font-variant: small-caps;
    line-height: 1;
    margin-bottom: 0;
}

.blognav {
    border-left: 1px solid #bbb;
    padding-left: 10px;
}

.blognav a img {
    vertical-align: text-top;
}

.post h3 {
    margin-top: 34.463px;
    margin-bottom: 14px;
}

.post ul {
    margin-top: -10px;
    margin-bottom: 21.326px;
}

.post ul ul {
    margin-top: 0;
}

/* Tables in the "Exploring weird maths with code" article. */
.post .weirdcode {
  margin-left: auto;
  margin-right: auto;
}

.post .weirdcode th, .post .weirdcode td {
  padding: 2px 10px;
}

.post .weirdcode th {
  font-weight: bold;
  border-bottom: 1px solid #111;
}

.post .weirdcode th:nth-child(3), .post .weirdcode td:nth-child(3) {
  border-left: 1px solid #111;
}

.post h1 + ul, .post h2 + ul {
    margin-top: 0;
}

.post blockquote {
    margin-left: 21.326px;
    padding-left: 13.197px;
    padding-right: 21.326px;
    border-left: 3px solid #aaa;
    margin-bottom: 13.197px;
}

.post blockquote p, .post blockquote li {
    font-style: italic;
}

.post .footnotes p, .post .footnotes li {
    font-size: 13.197px;
}

key {
    box-sizing: border-box;
    border: 1px solid black;
    border-radius: 3px;
    background-color: #fffafa;
    margin-right: 2px;
    padding: 0 2px;
    min-width: 1.5em;
    display: inline-block;
    text-align: center;
}


ul.blog.gallery {
    list-style-type: none;
}

.blog.gallery img {
    display: inline;
    margin-right: 5px;
    margin-bottom: 5px;
}

.blog.gallery li {
    margin: 0;
    padding: 0;
    display: inline;
}

.pagination p {
    margin-bottom: 0;
}

/* Sudoku solver */
table.sudokugrid {
    border-collapse: collapse;
    border: 1px solid black;
    margin-right: auto;
    margin-left: auto;
}

table.sudokugrid input {
    min-width: 18px;
    min-height: 18px;
    text-align: center;
}

table.sudokubox {
    border: 1px solid black;
    margin-bottom: 0px;
}

td.sudokubox {
    padding: 0;
}

.sudokugrids {
    margin-left: auto;
    margin-right: auto;
    display: inline-block;
}

.sudokugrids img {
    display: inline;
    margin-left: 9px;
    margin-right: 9px;;
}

.sudoku {
    text-align: center;
}



/* Admin section */
.admin h1 {
    font-variant: small-caps;
}

.admin h2 {
    margin-bottom: 0px;
}

.admin .grid_8, .admin .grid_2 {
    margin: 0;
}

.admin .photos form {
    clear: both;
}

.admin.login input {
    margin-bottom: 10px;
}

.admin.login form {
    margin-left: auto;
    margin-right: auto;
}

.admin .photos {
    margin-bottom: 100px;
}

.admin .photos form img {
    float: left;
    margin-right: 10px;
    margin-bottom: 40px;
}

.admin .photos form label {
    display: inline;
}

.admin .photos input[type=text] {
    min-width: 300px;
}
.admin .photos input[type=submit], .admin .photos input[type=text] {
    display: block;
}

.admin .photos p {
    clear: both;
}

.admin.blog input, .admin.blog textarea {
    margin-bottom: 8px;
}


ul.actions {
    list-style-type: none;
}

ul.actions li form {
    display: block;
}

ul.actions li a, ul.actions li input {
    border: 1px solid #111;
    border-radius: 3px;
    background: #bbb;
    text-align: center;
    margin-bottom: 2px;
    color: #111;
    display: block;
    font-size: inherit;
    font-family: inherit;
    padding: inherit;
    font-weight: inherit;
    width: 70px;
}

label {
    display: block;
    margin-bottom: 3px;
}

form.blogpost {
    margin-bottom: 50px;
}

form.blogpost input, form.blogpost textarea {
    margin-bottom: 10px;
}

/* Portfolio */
.portfolio section {
  min-height: 220px;
}

.aside {
    text-align: center;
}


/* Sticky footer */
html, body {
    height: 100%;
}

.push {
    height: 96px;
}