JSFiddle - React, Tailwind, and code Playground

HTML

<dl class="def_block">
  <dt>срака</dt>
  <p>Теорема</p>
  <dd>М'яка частина тіла, що знаходиться нижче спини та вижче ніг, у дівок може бути гарною, а у чоловіків волохатою</dd>
  <proof/>
  <dd>
    Це ж очевидно...
  </dd>
</dl>

CSS

.def_block {
  border-radius: 10px;
  box-shadow: 3px 3px 2px rgba(0, 0, 0, 0.5);
  overflow: hidden;
  text-align: left;
  background: rgb(235, 235, 255);
}
 
.def_block dt {
  display: none;
}
 
.def_block dd {
  margin-left: 5px;
}

.def_block proof:before {
  margin-left: 5px;
  content: "Доведення:";
  font-weight: bold;
}
 
.def_block p {
  background: blue;
  color: white;
  margin-top: 0;
  margin-bottom: 0px;
  text-indent: 5px;
}