/*****************************************************************************/
/*
/* Common
/*
/*****************************************************************************/

/* Global Reset */
* {
  margin: 0;
  padding: 0;
}

html, body {
  height: 100%;
  width: 100%;
}

body {
  background-color: #FFF;
  font: 13.34px Helvetica, Arial, sans-serif;
  font-size: small;
  text-align: center;
}

h1, h2, h3, h4, h5, h6, p {
  font-size: 100%;
}

h1 { margin-bottom: 1em; }
p { margin: 1em 0; }

a         { color: #00a; }
a:hover   { color: #000; }
a:visited { color: #a0a; }

/*****************************************************************************/
/*
/* Home
/*
/*****************************************************************************/
ul.posts {
  list-style-type: none;
  margin-bottom: 2em;
}

ul.posts li {
  line-height: 1.75em;
}

ul.posts span {
  color: #aaa;
  font-family: Monaco, "Courier New", monospace;
  font-size: 80%;
}

/*****************************************************************************/
/*
/* Site
/*
/*****************************************************************************/

.site {
  float: left;
  position: relative;
  font-size: 115%;
  text-align: left;
  width: 100%;
  line-height: 1.5em;
  padding-bottom: 25px;
}

.site .header a {
  font-weight: bold;
  text-decoration: none;
}

.site .header h1.title {
  display: inline-block;
  margin-bottom: 2em;
}

.site .header h1.title a {
  color: #a00;
}

.site .header h1.title a:hover {
  color: #000;
}

.site .header a.extra {
  color: #aaa;
  margin-left: 1em;
}

.site .header a.extra:hover {
  color: #000;
}

.site .meta {
  color: #aaa;
}

.site .footer {
  font-size: 80%;
  color: #666;
  border-top: 4px solid #eee;
  margin-top: 2em;
  overflow: hidden;
}

.site .footer .contact {
  float: left;
  margin-right: 3em;
}

.site .footer .contact a {
  color: #8085C1;
}

.site .footer .rss {
  margin-top: 1.1em;
  margin-right: -.2em;
  float: right;
}

.site .footer .rss img {
  border: 0;
}

/*****************************************************************************/
/*
/* Posts
/*
/*****************************************************************************/

/* standard */
.post {
  font-size: 1.1em;
  line-height: 1.5em;
}

.post pre {
  line-height: 1.5em;
  border: 1px solid #ddd;
  background-color: #eef;
  padding: 0 .4em;
  overflow-x: scroll;  /* If code is too big, scroll on x-axis. */
}

.post ul, .post ol {
  margin-left: 1.35em;
}

.post code {
  border: 1px solid #ddd;
  background-color: #eef;
  padding: 0 .2em;
}

.post pre code {
  border: none;
}

/* terminal */
.post pre.terminal {
  border: 1px solid #000;
  background-color: #333;
  color: #FFF;
}

.post pre.terminal code {
  background-color: #333;
}

.post h2 {
  margin-top: 1.2em;
}

/**
 * Rest of the file added by MQUINN.
 */
h1 {
  font-size: 1.8em;
}

h2 {
  font-size: 1.4em;
  margin-bottom: 10px;
}

h3 {
  font-size: 1.1em;
  margin-top: 1em;
  margin-bottom: 0.3em;
}

h4 {
  font-size: 0.9em;
  margin-top: 1em;
  margin-bottom: 0.3em;
}

#sidebar {
  float: left;
  position: relative;
  width: 200px;
  padding-top: 20px;
  padding-left: 20px;
}

#container {
  float: left;
  position: relative;
  width: 600px;
  padding-top: 20px;
  padding-left: 5px;
}

#sidebar hr {
  width: 105px;
  margin: 8px auto;
}

#euler {
  display: block;
  width: 90%;
  max-width: 180px;
  margin: 0 auto;
  margin-top: 30px;
}

#about {
  font-size: 1.2em;
  line-height: 140%;
}

#index-notification {
  border: 1px solid #5BB22C;
  background-color: #D4F6C1;
  padding: 10px;
  margin-bottom: 25px;
}

img#sidebar-photo {
  display: block;
  width: 90%;
  max-width: 120px;
  margin: 0 auto;
}

ul.nav, ul#writing {
  list-style: none;
}

ul.nav a, ul#writing a {
  text-decoration: none;
}

ul.nav a:hover, ul#writing a:hover {
  text-decoration: underline;
}

ul.nav {
  margin: 10px;
  text-align: center;
}

ul.nav a {
  color: #4008A0;
}

ul#writing a {
  color: #094962;
}

ul#writing {
  font-size: 1.1em;
  line-height: 200%;
}

ul#writing .date {
  float: right;
}

a#mail-icon, a#github-icon {
  float: left;
  border: none;
  text-decoration: none;
  padding: 0 1px;
}

a#mail-icon img {
  height: 29px;
}

a#github-icon img {
  margin-top: 1px;
  height: 27px;
}

.post img {
  max-width: 100%;
}

.site .meta {
  font-weight: bold;
  color: #717171;
}

div#reading-list ul, div#terpslinker ul {
  margin-left: 30px;
}

.project hr {
  width: 90%;
  margin: 30px auto;
}

.project img {
  height: 120px;
  margin: 5px 5px;
}

.strike {
  text-decoration: line-through;
}

.literary-quote {
  width: 100%;
  padding: 10px;
  text-align: center;
  font-style: italic;
  border-top: 2px solid #e4e4e4;
  border-bottom: 2px solid #e4e4e4;
}

.collapsible h3 {
  cursor: pointer;
  padding: 5px 7px;
  border: 1px solid #BCF141;
  background-color: #DAF2A2;
}

.collapsible ul {
  display: none;
}

#genlen {
  width: 50px;
}

#to-encrypt {
  width: 280px;
  height: 70px;
}

#encrypted {
  word-wrap: break-word;
}

table#passwords {
  width: 100%;
  table-layout: fixed;
}

table#passwords tr td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 840px) {
  #sidebar {
    display: block;
    width: 95%;
    padding: 5px;
    border-bottom: 1px solid black;
  }
  #container {
    display: block;
    width: 95%;
    overflow: hidden;
    padding: 10px;
    padding-top: 20px;
  }
  ul#writing li {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  ul#writing li span.date {
    display: none;
  }
  img#sidebar-photo {
    float: left;
    height: 60px;
    width: auto;
  }
  #sidebar hr {
    display: none;
  }
  #euler {
    display: none;
  }
  ul.nav {
    float: left;
    display: block;
    margin-top: 5px;
  }
  ul.nav li {
    float: left;
    display: inline;
    margin: 0 10px;
  }
}