a, .link {
  color: #228B22;
  text-decoration: none;
}

a:hover {
   color: #228B22;
   font-weight: bold;
}

ul {
   list-style-type: disc;
}

*,
::before,
::after {
    box-sizing: inherit;
}

.clearfix::after {
  display: block;
  content: " ";
  clear: both;
}

:root {
    background-position: center;
}

body {
    background: #000;
    color: #FFF;
    font-family: "Courier New", monospace;
    line-height: 1.3;
}

/* View port stages for body */

@media (max-width: 600px) { 
   body {
      margin: 0em 1em;
      font-size: 1.0em;
   }
}

@media (min-width: 601px) and (max-width: 900px) { 
   body {
      margin: 0em 1em;
      font-size: 1.0em;
   }
}

@media (min-width: 901px) and (max-width: 1250px) { 
   body {
      margin: 0em 8em;
      font-size: 1.0em;;
   }
}

@media (min-width: 1251px) and (max-width: 1500px) { 
   body {
      margin: 0em 10em;
   }
}

@media (min-width: 1501px) { 
   body {
      margin: 0em 30em;
   }
}

main pre {
     white-space: pre-wrap;
}

/* Header & footer */

.header {
    padding: 1em 0em;
    display: flex;
    background: #000;
    color: #FFF;
    position: sticky;
    top: 0;
    z-index: 100;
}

.header a, .link {
  color: #FFF;
  text-decoration: none;
}

.header a:hover {
  color: #FFF;
}

.header > * {
  padding: 0.5em;
}

.header > .homelink {
  flex: auto;
}

.header > .menuright {
  flex: initial;
}

#footer {
  margin: 0.5em;
  text-align: center;
}

/* Content common styling */

#content {
   background: #FFF;
   color: #000;
   padding: 1em 1em;
   overflow: auto;
   min-height: 100vh;
}

img.imgembed {
   float: right;
   width: 35%;
   padding: 0.5em;
   clear: both;
   height: auto;
}

/* Content blog styling */

.blog {
   font-family: "Courier New", monospace;
   color: #000;
}

.blog > .title {
   font-size: 1.5em;
}

.blog > .description {
   font-weight: bold;
   margin: 0.5em 0em;
}

.blog > .published{
   font-size: 0.9em;
   color: #444;
}

.blog > img.recipeimg {
   max-width: 100%;
   margin: 1em 0;
}

.blog > .content {
   line-height: 1.5em;
}

/* Index page formatting - cannot add theme */

.summary {
    margin: 1em 0.5em;
    font-size: 1em;
}

.summary .title {
    font-size: 1.2em;
}

.summary .created {
    font-size: 0.8em;
}

/* Pager */

.pager {
    display: flex;
    width: 100%;
    margin: 1em 0em;
}

.pager > .next {
    flex: 1 0 50%;
}

.next img {
    float: right;
}

.pager > .previous {
    flex: 1 0 50%;
}

.pager img {
    width: 2.5em;
}

/* Full size image */

.imagefull {
    width: 100%;
}