/*
Theme Name: Pepsite
Theme URI: http://pepijndevos.nl/
Description: The latest theme for Pepijndevos.nl
Version: 1.0
Author: Pepijn de Vos, Pepijn Goorden
Author URI: http://pepijndevos.nl/
*/

@font-face {
	font-family: 'Heading';
	src: url('CharlemagneStd-Bold.otf');
}

@font-face {
  font-family: 'Subheading';
  src: url(reeniebeanie.woff2) format('woff2');
}

header, footer, article, section, aside {
	display: block;
}

body, html {
	padding: 0;
	margin: 0;
	min-height: 100%;
}


body {
	background: url("bottom.png") no-repeat 600px bottom, url("repeat.png") repeat-y 624px bottom;
}

aside {
	position: fixed;
	top: 0;
	left: 900px;
    padding-top: 120px;
}

aside #chain {
        position: absolute;
        top: 0;
        left: 0;
}

article, header, footer {
	max-width: 500px;
	padding: 20px 60px;
	text-align: center;
	background: url("sep.png") no-repeat center 70px;
}

nav {
	width: 500px;
	padding: 0 60px;
}

section {
	text-align: left;
	line-height: 1.5em;
}

h1, h2, h3, h1 a, h2 a, h3 a {
	color: black;
	text-align: center;
	font-family: Heading, serif;
	padding-bottom: 10px;
	line-height: 30px;
}

header span {
	display: block;
    text-align: center;
    margin: 0 auto;
    font-size: 25px;
    line-height: 1em;
    font-family: Subheading, cursive;
}

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

a.strong {
	font-weight: bold;
}

article img {
	border: none;
	max-width: 100%;
}

aside li {
	width: 200px;
}

#wheel-img {
	position: fixed;
	top: 100px;
	left: -600px;
	z-index: -1;
        animation: spin 600s steps(3600) infinite;
}

@keyframes spin { 100% { transform:rotate(360deg); } }

.alignleft {
	float: left;
	margin-right: 5px;
}

.alignright {
	float: right;
	margin-left: 5px;
}

pre {
	border: 1px solid gray;
	white-space: pre-wrap;
	padding: 5px;
    line-height: 1.2em;
	font-weight: normal;
}

blockquote {
  margin: 1.5em 10px;
  padding: 0.5em 10px;
  font-style: italic;
}
blockquote:before {
  color: #ccc;
  content: open-quote;
  font-size: 4em;
  line-height: 0.1em;
  vertical-align: -0.4em;
}
blockquote p {
  display: inline;
}

figure.highlight {
  margin: 0;
}

.gist {
    font-size: 80%;
}

del {
	color: red;
}

ins {
	color: green;
}

li p {
    margin: 0;
    padding: 0;
}

.meta {
	margin-top: 1em;
}

.pagination {
	max-width: 500px;
	padding: 0 60px;
	text-align: center;
}

/* ipython */

.cell .output_subarea {
  overflow: hidden;
}

.cell .prompt {
  float: left;
  margin-left: -60px;
  width: 60px;
  text-align: right;
}

@media (max-width:1100px) {
        aside {
            z-index: 1;
            left: 0;
            width: 100%;
            padding-top: 0;
        }
        aside #chain {
            margin-left: 50px;
            position: relative;
            margin-bottom: -110px;
            cursor: pointer;
        }

        aside #drawer {
            background-color: white;
            max-height: 0;
            overflow: hidden;
            padding: 0 50px;
            transition: max-height 1s;
            border-bottom: 1px solid grey;
        }

        aside #drawer.open {
            max-height: 600px;
        }
}

@media (min-width:2000px) {
    body {
        width: 1100px;
        margin: 0 auto;
    }

    aside {
        left: calc(50% + 450px);
    }

    body {
        background: url("bottom.png") no-repeat calc(50% + 300px) bottom, url("repeat.png") repeat-y calc(50% + 243px) bottom;
    }
}

@media (prefers-color-scheme: dark) {
    #wheel-img {
        filter: invert() brightness(0.2);
    }
    body {
        color: lightgray;
        background-color: #151515;
    }
    a {
        color: rgb(224, 141, 46);
    }
    h1, h2, h3, h1 a, h2 a, h3 a {
        color: lightgray;
    }
}

/* pygments */
.hll { background-color: #ffffcc }
.c { color: #408080; font-style: italic } /* Comment */
.err { border: 1px solid #FF0000 } /* Error */
.k { color: #008000; font-weight: bold } /* Keyword */
.o { color: #666666 } /* Operator */
.cm { color: #408080; font-style: italic } /* Comment.Multiline */
.cp { color: #BC7A00 } /* Comment.Preproc */
.c1 { color: #408080; font-style: italic } /* Comment.Single */
.cs { color: #408080; font-style: italic } /* Comment.Special */
.gd { color: #A00000 } /* Generic.Deleted */
.ge { font-style: italic } /* Generic.Emph */
.gr { color: #FF0000 } /* Generic.Error */
.gh { color: #000080; font-weight: bold } /* Generic.Heading */
.gi { color: #00A000 } /* Generic.Inserted */
.go { color: #808080 } /* Generic.Output */
.gp { color: #000080; font-weight: bold } /* Generic.Prompt */
.gs { font-weight: bold } /* Generic.Strong */
.gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.gt { color: #0040D0 } /* Generic.Traceback */
.kc { color: #008000; font-weight: bold } /* Keyword.Constant */
.kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
.kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
.kp { color: #008000 } /* Keyword.Pseudo */
.kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
.kt { color: #B00040 } /* Keyword.Type */
.m { color: #666666 } /* Literal.Number */
.s { color: #BA2121 } /* Literal.String */
.na { color: #7D9029 } /* Name.Attribute */
.nb { color: #008000 } /* Name.Builtin */
.nc { color: #0000FF; font-weight: bold } /* Name.Class */
.no { color: #880000 } /* Name.Constant */
.nd { color: #AA22FF } /* Name.Decorator */
.ni { color: #999999; font-weight: bold } /* Name.Entity */
.ne { color: #D2413A; font-weight: bold } /* Name.Exception */
.nf { color: #0000FF } /* Name.Function */
.nl { color: #A0A000 } /* Name.Label */
.nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
.nt { color: #008000; font-weight: bold } /* Name.Tag */
.nv { color: #19177C } /* Name.Variable */
.ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
.w { color: #bbbbbb } /* Text.Whitespace */
.mf { color: #666666 } /* Literal.Number.Float */
.mh { color: #666666 } /* Literal.Number.Hex */
.mi { color: #666666 } /* Literal.Number.Integer */
.mo { color: #666666 } /* Literal.Number.Oct */
.sb { color: #BA2121 } /* Literal.String.Backtick */
.sc { color: #BA2121 } /* Literal.String.Char */
.sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
.s2 { color: #BA2121 } /* Literal.String.Double */
.se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
.sh { color: #BA2121 } /* Literal.String.Heredoc */
.si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
.sx { color: #008000 } /* Literal.String.Other */
.sr { color: #BB6688 } /* Literal.String.Regex */
.s1 { color: #BA2121 } /* Literal.String.Single */
.ss { color: #19177C } /* Literal.String.Symbol */
.bp { color: #008000 } /* Name.Builtin.Pseudo */
.vc { color: #19177C } /* Name.Variable.Class */
.vg { color: #19177C } /* Name.Variable.Global */
.vi { color: #19177C } /* Name.Variable.Instance */
.il { color: #666666 } /* Literal.Number.Integer.Long */