.pure-g {

    letter-spacing: 0em;
}

@font-face {
    font-family: 'sears_towerregular';
    src: url('fonts/sears_tower-webfont.woff2') format('woff2'),
         url('fonts/sears_tower-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

h1, h2, h3 { font-family: "sears_towerregular", Arial, sans-serif;}
p { font-family: "sears_towerregular", Arial, sans-serif;}
li { font-family: "sears_towerregular", Arial, sans-serif;}

a, a:visited {
    color: rgba(221,228,220, .8);
    font-family: "sears_towerregular", Arial, sans-serif;
}

h2 a { text-decoration: none; }

a:hover, a:active {
    color: rgba(101, 128, 100)
}


body {
    background-color: #000000;
    font-family: "sears-towerregular";
    color: #B0B0B0;
}

.landing {
    background: url("img/planck.jpg") no-repeat center;
    background-size: cover;
    height: 100vh;
}

.details {
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: 100vh;
}

.details ul {
    color: rgb(51, 78, 50);
    list-style: none;
}

.logo {
    padding: 2em;
}

.byline h1 {
    font-size: 1.7em;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-right: 1em;
    color: #F0F0F0;
    background-color: #101010;
    padding: 0.5em
}

.infolet p {
    font-size: 2em;
    margin: 2em 3em;
    text-align: left;
    text-justify: inter-word;
    text-align-last: left;
}

.contact {
    margin: 5em;
    text-align: center;
}

.contact ul {
    padding:0;
    margin:0;
    list-style: none;
    font-size: 1.5em;
    font-family: "sears_towerregular", Arial, sans-serif;
}


.article {
    position: relative;
    width: 100%;
    height: 100%;
}

.article ul {
    position: absolute;
    bottom: 0;
    right: 0;
    color: rgb(51, 78, 50);
    list-style: none;
    margin: 1em;
    animation: fadein 2.0s
}

.more {
    font-size: 4em;
    text-align: center; 
}

.episode-link {
    position: absolute;
    margin-left: 10%;
    bottom: 0;
    width: 90%;
    height: 100%;
}

.episode-link ul {
    font-size: 2em;
    position: absolute;
    bottom: 0;
    right: 0;
    color: rgb(51, 78, 50);
    list-style: none;
    margin: 0.5em 1em;
    animation: fadein 2.0s
}

.content {
    font-size: 1.5em;
    margin: 1.2em;
    text-align: left;
    text-justify: inter-word;
    text-align-last: left;
}

.content h1, h2, h3 {
    margin: 1em 3em;
}

.im {
    font-size: 2em;
}

.header-content {
    background-color: rgba(0, 0, 0, .5);
    position: absolute;
    bottom: 0;
    margin: 0em 10em 0em 0em;
    text-align: left;
}

.centered {
  display: flex;
  align-items: center;
  justify-content: center;
}

.with-margin {
  margin: 2em;
}

.max-width-screen {
  max-width: 95vw;
}

.article.mainpage {
  padding-top: 2em;
}

@media only screen and (min-width: 768px) {
    .infolet p {
        font-size: 2em;
    }
    .header-content {
        padding: 0em 2.5em;
    }
    .header-content p {
        font-size: 2.5em;
    }
    .header-content .small {
         font-size: 1.5em;
     }
    .header-content h1 {
        font-size: 2.5em;
    }
}

@media only screen and (min-width: 1024px) {
    .infolet p {
        font-size: 3em;
    }
} 

@media only screen and (max-width: 767px) {
    .infolet p {
        font-size: 1.2em;
    }

    .header-content p {
        font-size: 1.2em;
    }
    
    .header-content h1 {
        font-size: 1.5em;
        font-weight: normal;
    }

    .content {
	font-size: 1.2em;
	margin: 1em;
    }
}

@keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-moz-keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-webkit-keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-ms-keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

@-o-keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}
