/* your custom css */

@font-face {
  font-weight: 400;
  font-style: normal;
  font-family: "Stem Text";
  src: url("//cdn.evilmartians.com/front/fonts/subset-StemText-Regular.woff") format("woff");
}
@font-face {
  font-weight: 700;
  font-style: normal;
  font-family: "Stem Text";
  src: url("//cdn.evilmartians.com/front/fonts/subset-StemText-Bold.woff") format("woff");
}

@font-face {
  font-family: "Fira Code";
  src: url("../fonts/FiraCode-Regular.woff") format("woff");
}

body {
  font: 18px/30px "Stem Text", "Arial", sans-serif;
  color: #363636;
  background: #fff;
}

pre code {
  font-family: "Fira Code";
  font-size: 16px;
}

code {
  font-family: "Fira Code";
  font-size: 0.9em;
}

p {
  line-height: initial;
}

footer .sitemap div {
  flex: none;
}

.fixedHeaderContainer {
  box-sizing: border-box;
  background: #fff;
  border-bottom: solid 1px #e3e3e3;
}

.fixedHeaderContainer a {
  color: #9FA628;
}

header h2 {
  color: #9FA628;
  text-transform: uppercase;
}

.container .wrapper h2 {
  font-weight: bold;
}

.mainContainer .wrapper a {
  text-decoration: underline;
}

.projectTitle {
  color: #111;
}

.projectTitleName {
  color: #9FA628;
}

.mainContainer .wrapper a:hover {
  text-decoration: none;
}

.mainContainer .wrapper .post h3 {
  font-weight: bold;
}

small {
  font-size: 80%;
}

.navigationSlider .slidingNav ul li a {
  color: #9FA628;
}

nav.toc .toggleNav .navGroup.navGroupActive {
  background: #fafafa;
  color: #363636;
}

.mainContainer .wrapper .post .postHeader h1 {
  margin-bottom: 30px;
}

.hljs-doctag {
  color: #a0a1a7;
}

@keyframes humanoids-blink{

  0%, 48%{
    transform: scaleY(1);
  }

  50%{
    transform: scaleY(0);
  }

  52%, 100%{
    transform: scaleY(1);
  }
}

.humanoids{
  position: absolute;
  bottom: -10px;
  width: 150px;
  height: 60px;
  margin: 0 auto 0 -10px;
  font-size: 0;
}
.humanoids circle{
  transform: scaleY(1);
  transform-origin: 50%;
  animation-duration: 8s;
  animation-name: humanoids-blink;
  animation-iteration-count: infinite;
}
.humanoids svg{
  height: 60px;
}
.humanoids__human, .humanoids__martian{
  position: absolute;
  width: 80px;
  height: 90px;
  transition: transform 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transform: translateY(0);
}
.humanoids__human:hover, .humanoids__martian:hover{
  transform: translateY(-12px);
}
.humanoids__martian{
  left: 0;
}
.humanoids__human{
  right: 0;
}
.humanoids__human circle{
  animation-delay: 0.5s;
}

footer{
  width: 100%;
  z-index: 20;
  padding: 60px;
  justify-content: flex-end;
  position: relative;
  overflow: hidden;
}

footer.nav-footer {
  box-shadow: none;
  background: #363636;
}

footer .sitemap a {
  display: inline;
}

footer h5{
  color: white;
  font-weight: normal;
}
.footer--block{
  color: white;
  font-size: 14px;
  position: relative;
}

.footer--copy {
  margin: 0 0 10px;
}

.footer--block.legals{
  color:rgba(255, 255, 255, 0.6);
}
.footer--humanoids{
  position: absolute;
  bottom: -10px;
  margin-left: 50%;
  left: -60px;
}
.copy{
  position: relative;
}
.copy:before{
  content: '©';
  position: absolute;
  left: -20px;
  top: 0;
  line-height: 10px;
}

@media only screen and (min-device-width: 360px) and (max-device-width: 736px) {
  .footer--block:not(:first-child) {
    margin-top: 2em;
  }
}

@media only screen and (min-width: 1024px) {
}

@media only screen and (max-width: 1023px) {
}

@media only screen and (min-width: 1400px) {
}

@media only screen and (min-width: 1500px) {
}

.projectTitleName{
  font-weight: bold;
}

.mainContainer {
  background: none;
  border-top: 1px solid #e3e3e3;
}