<section>
  <h1>To Autumn</h1>
  <div class="author">by john keats
    <div class="bio">John Keats (31 October 1795 – 23 February 1821) was an English poet of the second generation of Romantic poets.
Keats had a style "heavily loaded with sensualities", notably in the series of odes.</div>
  </div>
  <p>Season of mists and mellow fruitfulness,
   Close bosom-friend of the maturing sun;
Conspiring with him how to load and bless
   With fruit the vines that round the thatch-eves run;
To bend with apples the moss'd cottage-trees,
   And fill all fruit with ripeness to the core;
      To swell the gourd, and plump the hazel shells
   With a sweet kernel; to set budding more,
And still more, later flowers for the bees,
Until they think warm days will never cease,
      For summer has o'er-brimm'd their clammy cells.</p>
<p>Who hath not seen thee oft amid thy store?
   Sometimes whoever seeks abroad may find
Thee sitting careless on a granary floor,
   Thy hair soft-lifted by the winnowing wind;
Or on a half-reap'd furrow sound asleep,
   Drows'd with the fume of poppies, while thy hook
      Spares the next swath and all its twined flowers:
And sometimes like a gleaner thou dost keep
   Steady thy laden head across a brook;
   Or by a cyder-press, with patient look,
      Thou watchest the last oozings hours by hours.
</p>
</section>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Tai+Heritage+Pro&family=Yeseva+One&display=swap" rel="stylesheet">

.bio {
  position: absolute;
  color: #602900;
  background-color: white;
  border: 2px solid #602900;
  text-transform: none;
  padding: 1rem;
  white-space: pre-wrap;  
  max-width: 30ch;
  width: max-content;
  font-size: 1rem;
  left: -50%;
}

section {
  width: max-content;
  margin: 1rem auto;
  padding: 2rem 3rem;
  background-color: #FFE1CB;
  border-radius: 0.5rem;
  position: relative;
}

h1 {
  color: #FF9241;
  background-color: #FFF0E4;
  font-family: 'Yeseva One', cursive;  
  font-size: 2.5rem;    
  margin: -2rem -3rem 0 -3rem;
  padding: 2rem 3rem 1rem 3rem;
  border-top-left-radius: 0.5rem;
  border-top-right-radius: 0.5rem;  
}

.author {
  position: relative;  
  font-size: 0.8rem;
  text-transform: uppercase;
  background-color: rgba(243, 241, 228, 0.9);
  border-top: 2px solid #554F27;
  color: #554F27;
  width: fit-content;
  margin: -1rem 0 0 auto;
  padding: 0.25rem 1rem;
  ling-height: 1.5;
}



p {
  white-space: pre-wrap;
  font-family: 'Tai Heritage Pro', serif;
  color: #222;  
}

body {
  padding: 1rem;
}