@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@700&display=swap');
*{    font-family: 'Oswald', sans-serif;}


html::after{
  color:white;
  display:block;
  white-space: pre-wrap;
  font-size:18px;
  text-align:right;
  line-height:20px;
  font-weight:bold;
  text-shadow:2px 2px 5px rgba(0,0,0,1);
  content:"Another 'one-line' website ( zero on Firefox ㋛ )   \a View the source to learn more!   \a";
  position:absolute;
  bottom:10px;
  right:10px;
  opacity:0.6;
  font-size:15px;
}

html {
  background-image:url(https://images.unsplash.com/photo-1775618189760-792fba0eb0f3?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3wzOTY4MzV8MHwxfHJhbmRvbXx8fHx8fHx8fDE3NzY2ODg5ODZ8&ixlib=rb-4.1.0&q=80&w=1080);
  width:100vw;
  height:100vh;
  margin:0;
  padding:0;
  background-size:cover;
  box-shadow: inset 0 0 400px black;
}

html::before{
  display:block;
  content:"Image by Uran Wang on Unsplash";
  color:white;
  margin-left:10px;
  position:absolute;
  top:10px;
  right:10px;
  font-size:12px;
}

head::before{
  line-height:1em;
  position:absolute;
  top: auto%;
  bottom: 18%;
  display:block;
  color:white;
  font-size:3.40em;
  content:"The hard path is often the right one. The river teaches more than the shore.";
  width:71%;
  text-transform:uppercase;
  margin-left: 16vw;
  -webkit-text-stroke-width: 2px;
  -webkit-text-stroke-color: black;
  font-weight:700;
  animation: fadein 3s;
  white-space: pre-wrap;
}

head{
  display:block;
}

head::after{
  display:block;
  content:"";
  color:white;
}


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