/* Simpol Theme - Download at: https://github.com/simpol-theme/simpol-theme-jekyll/releases
	 Coded by & Copyright © reserved by Mathson Design, LLC and Scott Mathson
   More information can be found at https://mathsondesignco.com/simpol
   Theme based off of Scott's personal site: https://scottmathson.me */




/**
 * CONTENTS
 *
 * NORMALIZING
 * Basic aspects--------Scott's version of "Normalize", custom to this site.
 *
 * PAGE-DEFAULT
 * Default styles----------------for pages, including only 3 media queries throughout entire stylesheet.
 *   > PAGE-DEFAULT-404----------------"404 Page" page specific.
 *
 * POST-DEFAULT
 * Default styles----------------for posts, etc.
 *
 * MISC
 * Miscellaneous styles----------------for items throughout site.
 */


/*--------------------------------*\
  #NORMALIZING
\*--------------------------------*/
html {
  position: relative;
  min-height: 100%;
  font-family: sans-serif;
  font-weight: normal;
  font-size: .9em;
  color: #333;
}
body {
  background-color: #fffefd;
}
h1,
h2 {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 700;
  color: #222;
  letter-spacing: .5px;
	font-size: 1.7em;
  line-height: 1.5em;
}
h3,
h4,
h5,
h6 {
  font-weight: 400;
  color: #333;
  line-height: 1.5em;
}
h3,
h4 {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}
h5,
h6 {
  font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, monospace;
}
p {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 400;
  font-size: 0.95em;
  line-height: 1.75em;
  color: #333;
}
article,
aside,
footer,
header,
nav,
section,
iframe {
  display: block;
  border: 0px solid;
}
hr {
  border: 0.5px solid;
  color: #dedede;
}
img {
  width: 100%;
}
a {
  color: #777;
  background-color: transparent;
}
a:hover,
a:focus {
  color: #454545;
  text-decoration: none;
}
button:hover,
button:focus {
  color: #454545;
  outline-width: 0;
  text-decoration: none;
}
blockquote {
  margin: 0 0 5% 0;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  padding: 2%;
  border-left: 4px solid #eee;
}
ul {
  list-style-type: circle;
}
li {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-weight: 400;
  line-height: 1.5em;
  color: #333;
}
pre,
code {
  background-color: #333;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  line-height: 1rem;
  font-weight: 400;
  font-size: .8rem;
  padding: 2px;
  color: #ededed;
  overflow: auto;
}
.mono {
	font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, monospace;
}
.pull-left {
  float: left;
}
.pull-right {
  float: right;
}
.btn-primary {
  font-size: .9em;
	text-align: center;
	color: white;
  background-color: #777;
  border: 0px;
  padding: 1.2%;
  text-decoration: none;
  outline: none;
}




/*--------------------------------*\
  #PAGE-DEFAULT
\*--------------------------------*/
@media (min-width: 320px) {
  #mini-about {
    margin: 0em 0em 3em 0em;
  }
  #mini-about .sm-1-col h1 {
    font-size: 2.1em;
    display: inline-block;
  }
  #mini-about .sm-1-col p {
    line-height: 1.9em;
    font-size: 0.95em;
  }
  #mini-about img {
    width: 20%;
  }
  .smaller {
  	font-size: 0.75em;
  }
  .main {
      padding: 2.5%;
      margin: 4%;

  }
  nav {
      position: relative;
      overflow: hidden;
      background-color: #fffefd; /* just in case */
      text-align: center;
      width: 100%;
      margin-top: 2.5%;
      margin: 3px 0px;
      border-bottom: 1px solid #dedede;
  }
  nav a {
      font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
      text-decoration: none;
  }
  nav h1 {
    font-size: 1.2em;
  }
  nav p {
    font-size: .8em;
  }
  .top-headline-photo {
    padding-bottom: 14%;
  }
	footer {
		float: none;
		text-align: center;
		padding: 0;
    top: 95vh;
    width: 100%;
	}
  .sm-1-col {
    width: 100%;
  }
  .mobile-hide {
    display: none;
  }
  .small-mobile-hide {
    display: none;
  }
  .mobile-only-show {
    display: block;
  }
  .post-cta {
  	float: none;
    width: 30%;
  }
  .social-sharing {
    margin: 2% auto;
  }
  .social-sharing svg {
    width: 8%;
  }
}
@media (min-width: 768px) {
  #mini-about .pull-left {
    margin-bottom: -1%;
  }
  .md-2-col {
    width: 48%;
  }
  .lg-onequarter-col {
    width: 48%;
  }
  .lg-threequarter-col {
    width: 48%;
  }
  .small-mobile-hide {
    display: block;
  }
  .post-header-img {
    padding-top: 10%;
  }
  .post-cta {
  	float: right;
  }
  .social-sharing svg {
    width: 3%;
  }
}
@media (min-width: 1060px) {
  #mini-about {
    margin: 0 0 4em 0;
  }
  .main {
      padding: 2%;
      margin: 0 5% 0 30%;
  }
  nav {
      position: fixed;
      padding: 2.5em;
			text-align: left;
      width: 18%;
      margin: 0;
      border-bottom: none;
  }
  nav h1 {
    font-size: 1.7em;
  }
  nav p {
    font-size: 1em;
  }
	footer {
		float: left;
	  position: fixed;
	  top: 88vh;
		padding: 2.5%;
    width: auto;
	}
  .lg-2-col {
    width: 48%;
  }
  .lg-onequarter-col {
    width: 20%;
  }
  .lg-threequarter-col {
    margin-left: 2.8%;
    width: 75%;
  }
  .post-cta {
  	width: 40%;
  }
  .social-sharing svg {
    width: 22%;
  }
  .social-sharing {
    left: -15%;
    margin: 0 auto;
    position: absolute;
    bottom: -0.05%;
    width: 15%;
  }
  .mobile-hide {
    display: block;
  }
  .small-mobile-hide {
    display: block;
  }
  .mobile-only-show {
    display: none;
  }
}
.page-wrapper {
  width: 100%;
  position: relative;
  z-index: 1
}
.inner-wrapper:after {
  content: "";
  display: block;
  clear: both;
}
.page-wrapper .inner-wrapper {
  width:100%;
  overflow: auto;
  z-index: auto;
}
footer p {
  font-size: .6em;
}




/*--------------------------------*\
  #POST-DEFAULT
\*--------------------------------*/
.post-preview {
  border-bottom: 0.5px solid #ddd;
  padding: 2.5% 0 2.5% 0;
}
.post-preview:after {
  content: "";
  display: table;
  clear: both;
}
.pager {
  margin: 0 auto;
}
.pager a {
  text-decoration: none;
}
.pager button {
  margin: 0 auto;
}
.post-header-img {
  max-width: 250px;
  max-height: 250px;
}
.social-sharing a {
  text-decoration: none;
}




/*--------------------------------*\
  #MISC
\*--------------------------------*/

.hidden {display: none;}
.inline-block {display: inline-block;}
.flex {display: flex;}
