@import 'https://fonts.googleapis.com/css?family=Cormorant+Garamond';
.content-areas {
  background: antiquewhite;
  color: #252525;
  font-size: 1.1em;
  line-height: 1;
  font-family: 'Cormorant Garamond', serif;
  transition: font-size 0.1s;	
  position: relative; }
  @media (min-width: 62em) {
    .content-areas {
      font-size: 1.2em; } }

@media (min-width:1em){
	bodies{display:flex}
}

.site-headers,
.article {
  padding: 1em;
  transition: padding 0.2s; }
  @media (min-width: 33em) {
    .site-headers,
    .article {
      padding: 2.8em; } }

.site-headers {
  background: #222;
  min-width: 300px;
  min-height: calc( 100vh - 60px ); }

.site-title {
  margin-bottom: 1em; }
  @media (min-width: 62em) {
    .site-title {
      margin-bottom: 25.2em; } }

.title {
  font-size: 1.4em;
  margin-bottom: 0.4em;
  white-space: nowrap;
  line-height: 0; }
  .title::after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    width: 2.8em;
    border-top: 0.06em solid;
    margin-left: 0.6em; }

.nr {
  font-size: 1.4em;
  position: fixed;
  bottom: 5vh;
  color: #FFF; }
  .nr .digit {
    font-size: 1.4em; }
    @media (min-width: 33em) {
      .nr .digit {
        display: block;
        font-size: 5.6em;
        line-height: 0.8;
        margin-top: -0.2em; } }

.split {
  display: flex;
  justify-content: space-between; }
  @media (min-width: 62em) {
    .split {
      display: block;
	  position: sticky;
      top: 114px;} }

.article-title {
  font-weight: 400;
  font-size: 2.8em;
  line-height: 0.85;
  text-transform: capitalize;
  position: relative;
  margin-top: 0;
  z-index: 2;
  mix-blend-mode: color-burn;}
  @media (min-width: 33em) {
    .article-title {
      font-size: calc(2em + 1vw);
	  margin-bottom: 90px;
	  margin-top:0; } }
  @media (min-width: 62em) {
    .article-title {
      font-size: calc(1em + 2.5vw);
      margin-bottom: 90px;
	  margin-top:0; } }

.article-title a {
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    width: calc(93%);
    overflow-x: hidden;
    line-height: 1.25;
    margin: -20px 0 -15px;
}

.article-continue {
    display: inline-block;
    color: inherit;
    background: #fcf4e9;
    text-decoration: none;
    border: 0.08em solid;
    padding: 0.7em 2em;
    text-transform: uppercase;
    font-size: 0.7em;
    letter-spacing: 0.5em;
    position: absolute;
    z-index: 2;
    box-shadow: 3px 3px 10px 0px rgba(0,0,0,0.15);
    font-weight: 900;
    border-radius: 5px;}
  .article-continue:hover {
	color:#fcf4e9;
	background:#000;
	transition:all .3s ease-in;}

img {
  max-width: 100%;
  height: auto;
  display: block; }


.article-img {
    margin-top: -3.6em;
    margin-left: 2.8em;
    position: relative;
    z-index: 1 }

@media (min-width: 33em) {
.article-img {
  margin-top: -5.6em;
  margin-left: 2.8em;
  position: relative;
  z-index: 1; }
}