* {
  -moz-box-sizing: border-box;
       box-sizing: border-box;
  margin: 0; }

body {
  font: 62.5%/1.6 Georgia, serif;
  background: #fffefe;
  color: #050000;
  height: 100%;
  text-rendering: optimizelegibility; }

h1, h2, h3, h4, h5, h6 {
  font: 400 17px/1.3 Sans-Serif; }
  h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #4A3E3D; }

h1 {
  font-size: 24px; }

h2 {
  font-size: 20px; }

h3 {
  font-size: 17px; }

h4 {
  font-size: 13px; }

h5 {
  font-size: 11px; }

h6 {
  font-size: 10px; }

p {
  margin: 15px 0;
  font-size: 13px; }

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

img#site-header-logo {
  max-width: 100%;
  height: auto;
  width: auto\9;
  /* ie8 */
  display: block;
  margin-left: auto;
  margin-right: auto; }

#site-navigation {
  margin-top: 2em;
  border-bottom: 2px solid #008fd4;
  padding-bottom: 1em; }
  #site-navigation ul {
    list-style-type: none;
    margin: 0;
    padding: 0; }
    #site-navigation ul li {
      display: inline; }
  #site-navigation a {
    text-decoration: none;
    font: 400 13px/1.3 Sans-Serif;
    color: #003955;
    font-weight: bold;
    padding-right: 1em; }
    #site-navigation a :hover {
      text-decoration: underline; }

.post .post-content {
  font: 17px/1.6 Georgia, serif; }
  .post .post-content p {
    font-size: 17px;
    text-align: justify; }
  .post .post-content img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 95%; }
  .post .post-content pre {
    background-color: #E8E8E8;
    padding: 0.5em;
    font-size: 0.7em;
    width: 100%;
    white-space: pre-wrap;
    overflow: auto; }
.post .post-info {
  margin-top: 2em; }
  .post .post-info ul, .post .post-info li {
    list-style: none;
    margin: 0;
    padding: 0; }
  .post .post-info a {
    text-decoration: none;
    color: #4A3E3D; }
  .post .post-info .post-publish-date {
    font-weight: bolder; }
  .post .post-info .post-author {
    margin-bottom: 1em; }
  .post .post-info .post-category {
    margin-bottom: 0.5em; }
.post blockquote {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  font-style: italicposts;
  margin: 0 1em 0 1em;
  padding: 0.5em; }

#page-side-bar {
  margin-top: 20px;
  max-width: 250px; }
  #page-side-bar h2 {
    font-size: 150%; }
  #page-side-bar h2 {
    margin-bottom: 0.7em; }
  #page-side-bar section {
    margin-bottom: 2em; }
  #page-side-bar form input {
    width: 100%; }

/* Desktop display styling*/
@media only screen and (min-device-width: 568px) {
  /*
	  My own little grid system, because why not
	*/
  .page-wrap {
    width: 80%;
    max-width: 1200px;
    margin: 30px auto; }
  .grid {
    overflow: hidden; }
    .grid .col {
      float: left;
      padding: 20px 0 20px 0; }
    .grid .col-post-info, .grid .col-1-5 {
      width: 20%; }
    .grid .col-sidebar, .grid .col-1-4 {
      width: 25%; }
    .grid .col-2-4 {
      width: 50%; }
    .grid .col-post {
      width: 80%;
      display: block;
      margin-left: auto;
      margin-right: auto; }
    .grid .col-posts {
      padding-right: 40px; }
    .grid .col-post-content, .grid .col-4-5 {
      width: 80%; }
    .grid .col-posts, .grid .col-post-footer, .grid .col-3-4 {
      width: 75%; }
    .grid .col-post-content {
      padding-left: 20px;
      padding-right: 20px; }
    .grid .col-article, .grid .col-1-1 {
      width: 100%; }
    .grid .single-col {
      padding: 20px 0 20px 0; }
  .post-info {
    text-align: right; } }

/* Smaller mobile devices styling*/
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) {
  #page-header, #page-posts, #page-post, .single-col {
    padding: 2em; }
  .post-info {
    text-align: left; }
    .post-info ul, .post-info li {
      display: inline; }
    .post-info .post-publish-date {
      display: block; }
    .post-info .post-author {
      display: block; }
    .post-info .post-category {
      display: block; }
    .post-info .post-tags li:after {
      content: " "; }
  .col-article {
    padding: 20px 0 20px 0; }
  #page-side-bar {
    max-width: 100%;
    background-color: #003955;
    color: #f2fbff;
    padding: 1em; }
    #page-side-bar a {
      color: #f2fbff; } }

.basic-form fieldset {
  border: 0;
  padding: 0; }
.basic-form label, .basic-form input {
  display: block; }
.basic-form input[type="text"], .basic-form input[type="email"] {
  width: 50%; }
.basic-form .radio-button-group label, .basic-form .radio-button-group input {
  display: inline; }
.basic-form .breathing-button {
  margin-top: 2em; }
.basic-form textarea {
  width: 100%;
  height: 30rem;
  border: 3px solid #cccccc;
  padding: 5px;
  font-family: Tahoma, sans-serif; }
