anyways that’s how i lost my medical license redux | lesson

<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=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
<style>
:root{
	--dark: #201b17;
    --dark2: #857B7B;
    --light: #fff;
    --light2: #F0E9E9;
    --accent1: #ce3d3b;
    --accent2: #df5e5b;
    --font: 'Noto Serif';
}
.bizz{
	max-width: 600px;
      width: 100%;
  	margin: 20px auto;
    border: 1px solid var(--dark2);
  	border-left: 6px solid var(--accent1);
  	box-sizing: border-box;
    font: 12px/16px var(--font);
      background: var(--light);
      color: var(--dark);
}
.headerimg{
	width: 100%;
    height: 200px;
  object-fit: cover;
  display: block;
}
.title{
	background: var(--dark);
    color: var(--light2);
     padding: 10px 20px;
 	 display: flex;
 	 justify-content: space-between;
  	align-items: baseline;
    gap: 16px;
}
.name{
	font-size: 16px;
    font-weight: 700;
  	color: var(--light);
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1.2;
}
.deets{
  letter-spacing: 2px;
  white-space: nowrap;
  flex-shrink: 0;
}
.text {
  padding: 20px;
  font-size: 12px;
  line-height: 1.8;
  text-align: justify;
  color: var(--dark);
  column-count: 2;
  column-gap: 24px;
  column-rule: 1px solid #EDEBEB;
}
.text::first-letter {
  font-size: 42px;
  font-weight: 800;
  color: var(--accent1);
  float: left;
  line-height: 0.8;
  margin: 4px 6px 0 0;
}
.text img{
	width: 100%;
    height: 150px;
  object-fit: cover;
  display: block;
}
quote{
	padding: 20px 10px;
    color: var(--dark2);
    font-size: 14px;
    display: block;
    line-height: 1.2;
    font-style: italic;
      margin-bottom: -10px
}
quote::before {content:'"'}
quote::after {content:'"'}
.requirements{
	width: auto;
	padding: 20px;
    border-top: 1px solid var(--dark2);
}
ul {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

li {
  padding-left: 2em;
  text-indent: -1em;
}

li:before {
  content: "✴";
  color: var(--dark2);
  padding-right: 5px;
}

b  { color: var(--accent1); font-weight: 700; }
i  { color: var(--dark2); }
@media (max-width: 480px) {
  .text { column-count: 1; padding: 16px; }
  .title { flex-direction: column; gap: 4px;}
}
h2{
    font-size: 20px;
    color: var(--accent1);
    text-align: left;
    text-transform: uppercase;
    line-height: 1.1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0px
}
  h2::after {
    content: '';
    display: block;
    height: 1px;
    flex-grow: 1;
    background-color: var(--accent2);}

.professor{
  text-align: center;
  margin: 20px auto 0;
  font: 14px/20px var(--body);
  color: var(--second);
}
.professor-sig {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  margin-top: 10px;
}
.professor-sig img:first-child {
  width: 55%;
  border: none
}
.professor-sig img:last-child {
  width: 75px;
  height: 75px;
  object-fit: cover;
  border-radius: 50%;
  border: 1px solid var(--accent1);
  flex-shrink: 0;
}
.credits {
  margin-top: 24px;
  text-align: center;
  text-transform: uppercase;
}
.credits a {
  color: var(--accent2);
  text-decoration: none;
  transition: color 0.3s;
}
.credits a:hover { color: var(--accent); }
</style>
<div class="bizz">
<img class="headerimg" src="https://64.media.tumblr.com/f622cac605fc5954774141f3fa486438/85438607145c2e70-55/s500x750/a87d33062122e4489beaf876162c93a11f31c943.gif">
<div class="title">
    <div class="name">past won't leave my bed</div>
    <div class="deets">year 0 | week #</div>
</div>
<div class="text">
hehe, dolor sit amet consectetur adipiscing elit. Quisque faucibus ex sapien vitae pellentesque sem placerat. In id cursus mi pretium tellus duis convallis. <b>Tempus leo eu aenean sed diam urna tempor. Pulvinar vivamus fringilla lacus nec metus bibendum egestas.</b> Iaculis massa nisl malesuada lacinia integer nunc posuere. Ut hendrerit semper vel class aptent taciti sociosqu. Ad litora torquent per conubia nostra inceptos himenaeos.
<quote>i try to move on, but the past won't leave my bed.</quote>
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit. <i>Quisque faucibus ex sapien vitae pellentesque sem placerat. In id cursus mi pretium tellus duis convallis.</i> Tempus leo eu aenean sed diam urna tempor. Pulvinar vivamus fringilla lacus nec metus bibendum egestas. Iaculis massa nisl malesuada lacinia integer nunc posuere. Ut hendrerit semper vel class aptent taciti sociosqu. Ad litora torquent per conubia nostra inceptos himenaeos.
<img src="https://64.media.tumblr.com/b3ceccbd0d2490e49814ededecaf96c1/1b280066452910cd-f0/s540x810/b03f7d1b6184537fb1dd1dd800aed417b9dd3103.gif">
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit. Quisque faucibus ex sapien vitae pellentesque sem placerat. In id cursus mi pretium tellus duis convallis. Tempus leo eu aenean sed diam urna tempor. Pulvinar vivamus fringilla lacus nec metus bibendum egestas. Iaculis massa nisl malesuada lacinia integer nunc posuere. Ut hendrerit semper vel class aptent taciti sociosqu. Ad litora torquent per conubia nostra inceptos himenaeos.
<p>Lorem ipsum dolor sit amet consectetur adipiscing elit. Quisque faucibus ex sapien vitae pellentesque sem placerat. In id cursus mi pretium tellus duis convallis. Tempus leo eu aenean sed diam urna tempor. Pulvinar vivamus fringilla lacus nec metus bibendum egestas. Iaculis massa nisl malesuada lacinia integer nunc posuere. Ut hendrerit semper vel class aptent taciti sociosqu. Ad litora torquent per conubia nostra inceptos himenaeos.
</div>
<div class="requirements">
<div><h2>requirements</h2>
<ul>
<li>am i a chud</li>
<li>forlorn from this world</li>
<li>destined to chud along</li>
<li>until the chud end</li>
</ul></div>
<div><h2>lesson</h2>
<p>don't steal my dude basic shit 101 uhhh i dunno what else, like cite your sources, if you don't cite your sources you're a stinky head uhhhhhh what else, write an essay why you lost your medical license anddddddddddddddddddd i guess a letter to the family of the lost patient
</div>
<div class="professor">if you have questions, no you don't
  <div class="professor-sig">
    <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/7/7f/Huey_Long_Signature.svg/1280px-Huey_Long_Signature.svg.png" alt="signature">
    <img src="https://64.media.tumblr.com/eced3886cf943ce7bba6a0e23adb4bbf/20638eb9ea1f1a8c-0e/s400x600/7019cc2a362e911fc9fb362ff96d28e95d22af2e.gifv" alt="professor">
  </div>
</div>
<div class="credits"><a href="https://finchscodes.tumblr.com" target="_blank">CODED BY FINCH</a></div>
</div>
</div>