/*
 * plain.css - BunsenLabs main stylesheet
 * Copyright (C) 2015 The BunsenLabs Team
 *
 * Parts of it and the overall look are based on or copied from the
 * 'Buttondown' pandoc stylesheet by Ryan Gray. Link to the original
 * file: https://gist.github.com/ryangray/1882525
 */

/* Fonts imports */
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600);
/* no code tags ATM @import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400); */

div.icons p img {
  width:48px;
}

.center {
  text-align: center;
}

.marginbox {
  margin: 20px 20px 20px 20px;
}

monospace {
  font-family: "Ubuntu Mono", monospace;
  font-size: 107%;
}

body {
    margin: auto;
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    margin-bottom: 2ex;
    color: #111;
    text-rendering: optimizeLegibility;
}

body > p {
  line-height: 1.50;
}


html {
  border-top: 5px solid #3E3E3E;
}

@media all and (min-width: 800px) {
  body {
    width: 750px;
  }
  img.logo {
    height: 120px;
  }
}

@media all and (max-width: 799px) {
  body {
    width: 90%;
  }
  img.logo {
    width: 85%;
  }
}

@media all and (max-width: 799px) and (orientation: landscape) {
  body {
    width: 75%;
  }
  img.logo {
    width: 65%;
  }
}

h1, h2, h3, h4, h5, h6
{
    font-family: "Open Sans", sans-serif;
    font-weight: 600;
    page-break-after: avoid; /* Firefox, Chrome, and Safari do not support the property value "avoid" */
}

h1 { font-size: 125%; }

pre, code 
    {
    background-color: rgba(203,207,211, 0.1);
    font-family: 'Ubuntu Mono', monospace;
    white-space: pre;
    }

code
    {
    font-size: 110%;
    }

pre /* Code blocks */
    {
    /* Distinguish pre blocks from other text by more than the font with a background tint. */
    padding: 0.5em; /* Since we have a background color */
    border-radius: 0px; /* Softens it */
    /* Give it a some definition */
    border: 1px solid #aaa;
    /* Set it off left and right, seems to look a bit nicer when we have a background */
    line-height: 1.25;
    }

@media screen
    {
    pre
        {
        /* On screen, use an auto scroll box for long lines, unless word-wrap is enabled */
        white-space: pre;
        overflow: auto;
        /* Dotted looks better on screen and solid seems to print better. */
        border: 1px dotted #777;
        }
    }

code /* All inline code spans */
    {
    }

hr {
  height: 1px;
  border-width: 0;
  background-color: #3e3e3e;
  color: #3e3e3e;
  text-align:center; margin: 0 auto;
  margin-top: 40px;
  margin-bottom: 20px;
  width: 20%;
}

hr.footer {
  width: 100%;
  color: #aaa;
  background-color: #aaa;
}

a /* All links */
    {
    /* Keep links clean. On screen, they are colored; in print, they do nothing anyway. */
    text-decoration: none;
    color: #9b0c0c;
    }
a:visited
    {
    color: #9b0c0c;
    }
@media screen
    {
    a:hover
        {
        /* On hover, we indicate a bit more that it is a link. */
        text-decoration: underline;
        }
    }

a.header, #TOC ul a {
  color: black;
}

a.footnote, a.footnoteRef { /* Pandoc, MultiMarkdown footnote links */
    font-size: small; 
    vertical-align: text-top;
}

a[href^="#fnref"], a.reversefootnote /* Pandoc, MultiMarkdown, ?? footnote back links */
    {
    }

@media print
    {
    a[href^="#fnref"], a.reversefootnote /* Pandoc, MultiMarkdown */
        {
        /* Don't display these at all in print since the arrow is only something to click on */
        display: none;
        }
    }
    
div.footnotes /* Pandoc footnotes div at end of the document */
    {
    }
    
div.footnotes li[id^="fn"] /* A footnote item within that div */
    {
    }

div#TOC, nav#TOC
    {
    /* Put border on bottom to separate it from body. */
    border-bottom: 1px solid #aaa;
    margin-bottom: 0.5em;
  }

span.semibold {
  font-weight: 600;
}

#feed {
  max-width:700px;
  margin:auto;
}

.gha-header, .gha-push {
  display:none;
}

.gha-feed a, .gha-feed a:visited {
    color: #9b0c0c ! important;
}

.gha-feed {
  background-color: rgba(203, 207, 211, 0.1) ! important;
}

/* ---- Tables ---- */

/*  A clean textbook-like style with horizontal lines above and below and under 
    the header. Rows highlight on hover to help scanning the table on screen.
*/

table
    {
    border-collapse: collapse;
    border-spacing: 0; /* IE 6 */

    border-bottom: 2pt solid #000;
    border-top: 2pt solid #000; /* The caption on top will not have a bottom-border */

    /* Center */
    margin-left: auto;
    margin-right: auto;

    width:100%;
    }
    
thead /* Entire table header */
    {
    border-bottom: 1pt solid #000;
    background-color: #f5f5f5; /* Does this BG print well? */
    }

tr.header /* Each header row */
    {
    } 

tbody /* Entire table  body */
    {
    }

/* Table body rows */

tr  {
    }
tr.odd:hover, tr.even:hover /* Use .odd and .even classes to avoid styling rows in other tables */
    {
    background-color: #eee;
    }
    
/* Odd and even rows */
tr.odd {}
tr.even {}

td, th /* Table cells and table header cells */
    { 
    vertical-align: top; /* Word */
    vertical-align: baseline; /* Others */
    padding-left:   0.5em;
    padding-right:  0.5em;
    padding-top:    0.2em;
    padding-bottom: 0.2em;
    }

table.plain {
  border: none;
}

table.plain td, table.plain th {
  vertical-align: middle;
}

/* Removes padding on left and right of table for a tight look. Good if thead has no background color*/
/*
tr td:last-child, tr th:last-child
    {
    padding-right: 0;
    }
tr td:first-child, tr th:first-child 
    {
    padding-left: 0;
    }
*/

th /* Table header cells */
    {
    font-weight: bold; 
    }

tfoot /* Table footer (what appears here if caption is on top?) */
    {
    }

caption /* This is for a table caption tag, not the p.caption Pandoc uses in a div.figure */
    {
    caption-side: top;
    border: none;
    font-size: 0.9em;
    font-style: italic;
    text-align: center;
    margin-bottom: 0.3em; /* Good for when on top */
    padding-bottom: 0.2em;
    }

ul > li, ol > li {
  margin-top: 0px;
  line-height: 1.5;
}

.padlock {
  position: relative;
}

.padlock img {
  height:32px;
  position: absolute;
  top:0px;
  right:0px;
}

/* Definition lists */

dl > dt
{
  font-weight: 600;
  margin-bottom: 0.25em;
  margin-top: 0.5em;
}