body {
  position:relative;
  background-color: #f01a0f;
  padding:0;
  margin:0;
  overflow: hidden;
  height: 100vh;
  width: 100vw;
  font-family: Futura-R; 
}

header {
  padding:0;
  margin:0;
  width: 100%;
  height: 10vh;
}

.heading {
  margin: 1.5vh 25px;
  font-size: 6vh;
  font-weight: bold;
}

main {
  padding:0;
  margin:0;
  width: 100%;
  height: 80vh;
}

#fundus {
  width: 50vw;
  text-align: left;
}
#fundus p {
  margin-top: -1.5vh;
}

.source, article header {
  margin: 1.5vh 25px;
  font-size: 2.5vh;
  background-color: rgb(255,255,255,0.5);
  box-shadow: 0 0 0 100vmax rgb(255,255,255,0.5);
  clip-path: inset(0 -100vmax);
  z-index: 0;
}

.inspiring,
.influencial {
  font-size: 3vw;
  text-align: right;
}

.inspiring a,
.influencial a {
  font-size: 1.5vh;
  color: black;
}

.inspiring a:hover,
.influencial a:hover {
  color: white;
}

footer {
  padding:0;
  margin:0;
  width: 100%;
  height: 10vh;
}

.float {
  position:absolute;
  z-index: 20;
  bottom: 0;
  right: 0;
/*  width: 100%;
  height: 40vh;
  background-image: url('images/scharfenstein-avatar.jpg');
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right bottom; */
}

img.float {
  max-width: 50vw;
}

img {
  max-height: 50vh;
}

.slick-slide {
  margin: 0px 20px;
}

@media (max-width: 640px) {
.heading {
  margin: 1.5vh 25px;
  font-size: 4vh;
  font-weight: bold;
}
#fundus {
  width: 100vw;
}
#fundus article {
  max-width:60%;
}
.inspiring,
.influencial {
  font-size: 5vw;
  text-align: left;
}
.inspiring a,
.influencial a {
  font-size: 1.5vh;
  color: black;
}
.float {
  z-index: -10;
}}

/* FONT */
/* SOURCE */

@font-face {
    font-family: Futura-EL;
    src: url(../fonts/FTR45.otf);
    font-weight: 100;
}

@font-face {
    font-family: Futura-R;
    src: url(../fonts/FTR45.otf);
    font-weight: 500;
}

@font-face {
    font-family: Futura-B;
    src: url(../fonts/FTR45.otf);
    font-weight: 900;
}