/*
:Author: David Goodger (goodger@python.org)
:Id: $Id: html4css1.css 7614 2013-02-21 15:55:51Z milde $
:Copyright: This stylesheet has been placed in the public domain.

Default cascading style sheet for the HTML output of Docutils.

See http://docutils.sf.net/docs/howto/html-stylesheets.html for how to
customize this style sheet.
*/

/* used to remove borders from tables and images */
.borderless, table.borderless td, table.borderless th {
  border: 0 }

table.borderless td, table.borderless th {
  /* Override padding for "table.docutils td" with "! important".
     The right padding separates the table cells. */
  padding: 0 0.5em 0 0 ! important }

.first {
  /* Override more specific margin styles with "! important". */
  margin-top: 0 ! important }

.last, .with-subtitle {
  margin-bottom: 0 ! important }

.hidden {
  display: none }

a.toc-backref {
  text-decoration: none ;
  color: black }

blockquote.epigraph {
  margin: 2em 5em ; }

object[type="image/svg+xml"], object[type="application/x-shockwave-flash"] {
  overflow: hidden;
}

div.abstract {
  margin: 2em 5em }

div.abstract p.topic-title {
  font-weight: bold ;
  text-align: center }

div.admonition, div.attention, div.caution, div.danger, div.error,
div.hint, div.important, div.note, div.tip, div.warning, div.sidebar {
/* stolen from Boostrap 3 (.panel .panel-default) */
  margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
          box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
  padding: 0 15px 15px 15px;
}

div.attention, div.caution, div.danger, div.error, div.warning {
  /* stolen from Boostrap 3 (.panel .panel-danger) */
  border-color: #EBCCD1;
}

div.admonition p.admonition-title, div.hint p.admonition-title,
div.important p.admonition-title, div.note p.admonition-title,
div.tip p.admonition-title, div.sidebar p.sidebar-title,
div.attention p.admonition-title, div.caution p.admonition-title,
div.danger p.admonition-title, div.error p.admonition-title,
div.warning p.admonition-title {
/* stolen from Boostrap 3 (.panel .panel-default .panel-heading) */
  font-size: 16px;
  color: #333;
  background-color: #F5F5F5;
  padding: 10px 15px;
  margin-left: -15px;
  margin-right: -15px;
  border-bottom: 1px solid rgba(0, 0, 0, 0);
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  color: #333;
  background-color: #F5F5F5;
  border-color: #DDD;
}

div.attention p.admonition-title, div.caution p.admonition-title,
div.danger p.admonition-title, div.error p.admonition-title,
div.warning p.admonition-title {
  /* stolen from Boostrap 3 (.panel .panel-danger) */
  color: #A94442;
  background-color: #F2DEDE;
  border-color: #EBCCD1;
}

/* Uncomment (and remove this text!) to get reduced vertical space in
   compound paragraphs.
div.compound .compound-first, div.compound .compound-middle {
  margin-bottom: 0.5em }

div.compound .compound-last, div.compound .compound-middle {
  margin-top: 0.5em }
*/

div.dedication {
  margin: 2em 5em ;
  text-align: center ;
  font-style: italic }

div.dedication p.topic-title {
  font-weight: bold ;
  font-style: normal }

div.figure {
  margin-left: 2em ;
  margin-right: 2em }

div.footer, div.header {
  clear: both;
  font-size: smaller }

div.line-block {
  display: block ;
  margin-top: 1em ;
  margin-bottom: 1em }

div.line-block div.line-block {
  margin-top: 0 ;
  margin-bottom: 0 ;
  margin-left: 1.5em }


html[dir="rtl"] div.line-block div.line-block {
  margin-top: 0 ;
  margin-bottom: 0 ;
  margin-right: 1.5em  ;
  margin-left: 0  ;
}

div.sidebar {
  margin-left: 2em;
  min-height: 20px;
  width: 40% ;
  float: right ;
  clear: right }

div.sidebar p.rubric {
  font-size: medium }

div.system-messages {
  margin: 5em }

div.system-messages h1 {
  color: #a94442 }

div.system-message {
  border: 1px solid #ebccd1;
  padding: 1em }

div.system-message p.system-message-title {
  color: #a94442 ;
  font-weight: bold }

div.topic {
  margin: 2em }

img.align-left, .figure.align-left, object.align-left {
  clear: left ;
  float: left ;
  margin-right: 1em }

img.align-right, .figure.align-right, object.align-right {
  clear: right ;
  float: right ;
  margin-left: 1em }

img.align-center, .figure.align-center, object.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.align-left {
  text-align: left }

.align-center {
  clear: both ;
  text-align: center }

.align-right {
  text-align: right }

/* reset inner alignment in figures */
.figure.align-right {
  text-align: inherit }

/* div.align-center * { */
/*   text-align: left } */

ol.simple, ul.simple {
  margin-bottom: 1em }

ol.arabic {
  list-style: decimal }

ol.loweralpha {
  list-style: lower-alpha }

ol.upperalpha {
  list-style: upper-alpha }

ol.lowerroman {
  list-style: lower-roman }

ol.upperroman {
  list-style: upper-roman }

p.attribution {
  text-align: right ;
  margin-left: 50% }

p.caption {
  font-style: italic }

p.credits {
  font-style: italic ;
  font-size: smaller }

p.label {
  white-space: nowrap }

p.rubric {
  font-weight: bold ;
  font-size: larger ;
  color: maroon ;
  text-align: center }

p.sidebar-subtitle {
  font-weight: bold }

p.topic-title {
  font-weight: bold }

pre.address {
  margin-bottom: 0 ;
  margin-top: 0 ;
  font: inherit }

pre.code .ln { color: grey; } /* line numbers */
/*
pre.code, code { background-color: #eeeeee }
pre.code .comment, code .comment { color: #5C6576 }
pre.code .keyword, code .keyword { color: #3B0D06; font-weight: bold }
pre.code .literal.string, code .literal.string { color: #0C5404 }
pre.code .name.builtin, code .name.builtin { color: #352B84 }
pre.code .deleted, code .deleted { background-color: #DEB0A1}
pre.code .inserted, code .inserted { background-color: #A3D289}
*/

span.classifier {
  font-style: italic }

span.classifier-delimiter {
  font-weight: bold }

span.option {
  white-space: nowrap }

span.pre {
  white-space: pre }

span.problematic {
  color: red }

span.section-subtitle {
  /* font-size relative to parent (h1..h6 element) */
  font-size: 80% }

table.citation {
  border-left: solid 1px gray;
  margin-left: 1px }

table.docinfo {
  margin: 2em 4em }

table.docutils {
  margin-top: 0.5em ;
  margin-bottom: 0.5em }

table.footnote {
  border-left: solid 1px black;
  margin-left: 1px }

table.docutils td, table.docutils th,
table.docinfo td, table.docinfo th {
  padding-left: 0.5em ;
  padding-right: 0.5em ;
  vertical-align: top }

table.docutils th.field-name, table.docinfo th.docinfo-name {
  font-weight: bold ;
  text-align: left ;
  white-space: nowrap ;
  padding-left: 0 }

/* "booktabs" style (no vertical lines) */
table.docutils.booktabs {
  border: 0px;
  border-top: 2px solid;
  border-bottom: 2px solid;
  border-collapse: collapse;
}
table.docutils.booktabs * {
  border: 0px;
}
table.docutils.booktabs th {
  border-bottom: thin solid;
  text-align: left;
}

h1 tt.docutils, h2 tt.docutils, h3 tt.docutils,
h4 tt.docutils, h5 tt.docutils, h6 tt.docutils {
  font-size: 100% }

ul.auto-toc {
  list-style-type: none }

a.footnote-reference {
     line-height: 0px;
}

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

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000; opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxContent{margin-top:20px;background:#000;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{border:5px solid #000; background:#fff;}
        #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
        #cboxCurrent{position:absolute; top:-20px; right:0px; color:#ccc;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
        
        #cboxSlideshow{position:absolute; top:-20px; right:90px; color:#fff;}
        #cboxPrevious{position:absolute; top:50%; left:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top left; width:28px; height:65px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:bottom left;}
        #cboxNext{position:absolute; top:50%; right:5px; margin-top:-32px; background:url(images/controls.png) no-repeat top right; width:28px; height:65px; text-indent:-9999px;}
        #cboxNext:hover{background-position:bottom right;}
        #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url(images/controls.png) no-repeat top center; width:38px; height:19px; text-indent:-9999px;}
        #cboxClose:hover{background-position:bottom center;}

#container {
    width: 960px;
    margin: 0 auto;
}

#contentcolumn {
    max-width: 760px;
}
#q {
    width: 150px;
}

img {
    max-width: 90%;
}

.postbox {
    border-bottom: 2px solid darkgrey;
    margin-bottom: 12px;
}

.titlebox {
    text-align: right;
}

#addthisbox {margin-bottom: 12px;}

td.label {
    /* Issue #290 */
    background-color: inherit;
}

.footnote-reference {
    /* Issue 290 */
    vertical-align: super;
    font-size: xx-small;
}


.caption {
    /* Issue 292 */
    text-align: center;
    padding-top: 1em;
}

div.figure > img,
div.figure > a > img {
    /* Issue 292 */
    display: block;
    margin-left: auto;
    margin-right: auto;
}

blockquote p, blockquote {
  font-size: 17.5px;
  font-weight: 300;
  line-height: 1.25;
}

ul.bricks > li {
    display: inline;
    background-color: lightblue;
    padding: 8px;
    border-radius: 5px;
    line-height: 3;
    white-space:nowrap;
    margin: 3px;
}

.at300b, .stMainServices, .stButton, .stButton_gradient {
    box-sizing: content-box;
}

pre, pre code {
    white-space: pre;
    word-wrap: normal;
    overflow: auto;
}

article.post-micro {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 1.5em;
}

.image-block {
    display: inline-block;
}

.flowr_row {
    width: 100%;
}

.tags {
    padding-left: 0;
    margin-left: -5px;
    list-style: none;
    text-align: center;

}

.tags > li {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #999;
    border-radius: 10px;
}

.tags > li a {
    color: #fff;
}

.metadata p:before,
.postlist .listdate:after {
    content: " — ";
}

.metadata p:first-of-type:before {
    content: "";
}

.metadata p {
    display: inline;
}

.posttranslations h3 {
    display: inline;
    font-size: 1em;
    font-weight: bold;
}

.posttranslations h3:last-child {
    display: none;
}

.entry-content {
    margin-top: 1em;
}

.navbar-brand {
    padding: 0 15px;
}

.navbar-brand #blog-title {
    padding: 15px 0;
    display: inline-block;
}

.navbar-brand #logo {
    max-width: 100%;
}

.navbar-brand>img {
    display: inline;
}

.row {
    margin: 0;
}

/* for alignment with Bootstrap's .entry-content styling */
.entry-summary {
    margin-top: 1em;
}

/* Custom page footer */
#footer {
    padding-top: 19px;
    color: #777;
    border-top: 1px solid #e5e5e5;
}

.codetable {
    table-layout: fixed;
}

.codetable pre {
    overflow-x: scroll;
}

/* hat tip bootstrap/html5 boilerplate */
@media print {
    *, *:before, *:after {
        font-family: Garamond, Junicode, serif;
    }

    body {
        font-size: 12pt;
    }

    article .entry-title a[href]:after,
    article .metadata a[href]:after,
    article .tags a[href]:after {
        content: "";
    }

    article .metadata .sourceline {
        display: none;
    }

    article .metadata .linkline a[href]:after {
        content: " (" attr(href) ")";
    }

    .navbar {
        display: none;
    }
}

/* there are many css like it, but this is custom */

aside.establishing_context {
    background-color: hsl(180, 30%, 85%);
    font-style: italic;
    font-weight: lighter;
    padding-left: 7.5%;
    padding-right: 7.5%;
}

article {
    max-width: 80ex;
    /* Having the article block be relative display, even if we don't
     * move it relative to its original position, changes how we're
     * able to position its children.
     */
    position: relative;
}

/* Any bits of code that are in-line, not in dedicated code listing blocks,
 * should use normal colors and spacing. */
article code {
    background: transparent;
    color: inherit;
    font-family: "droid sans mono", "inconsolata", "consolas", monospace;
    font-weight: bolder;
    padding: 0;
}

/* bootstrap, that's a nice style for emphasizing a pull-quote. But not every
 * blockquote deserves that much emphasis. */
article blockquote {
    font: inherit;
    line-height: inherit;
}

cite {
    font-style: italic;
}

.footnotes {
    background: hsl(0, 0%, 90%);
    padding: 1em;
}

dt + dd {
    margin-bottom: 1.4em;
}

dl dd {
    margin-left: 4ex;
}

input[type='text'] {
    padding-left: 0.25ex;
}

a[href^="https://docs.djangoproject.com/"],
a[href^="https://github.com/django/"],
a[href^="https://code.djangoproject.com/"] {
    /* official django color is too hard to tell from black */
    /* color: hsl(160, 49%, 11%); */ /* #092E20 */
    color: hsl(160, 49%, 41%);
}

/* The intention here is to hide footnote markers on the index pages,
 * while leaving them visible in the articles themselves. */
.footnote-marker {
    display: none;
}

article a.footnote-marker {
    display: inline;
}


.popquiz {
    position: absolute;
    left: 100%;
    border: thick mediumvioletred double;
    margin-left: 4em;
    padding: 1em;
}

.popquiz-header {
    font-family: cursive, fantasy;
    font-variant: small-caps;
    font-size: 200%;
    text-align: center;
}

.popquiz input.spoiler {
    display: none;
}

/* label is visible as long as it follows a checked input */
.popquiz input:checked + label[for="answer_visible"] {
    display: initial;
    /* absolute position so the invisible answer text will overlap it. */
    position: absolute;
}

/* when no longer checked, it's hidden */
.popquiz label[for="answer_visible"] {
    display: none;
}


/* The answer starts hidden, then becomes visible. */
.popquiz .quiz_answer {
    visibility: hidden;
}

#answer_visible:checked ~ .quiz_answer {
    visibility: inherit;
}