JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>ЭКГ-5</title>
    </head>

<body>
<div class="ekg">
<div class="inekg">
<p>ЭКГ-5</p>
</div>
<p>ЭКГ-5 - карьерный гусенечный эксковатор с ковшом вместимостью 5м<sup>3</sup> - электрическая карьерная полноповоротная лопата на гусеничном ходу, предназначенная для выемки и погрузки в транспортные средства полезных ископаемых и вскрышных пород, в том числе тяжелых скальных, предварительно разрыхленных взрывом, в угольной промышленности, а также для выполнения больших объемов земляных работ в промышленном строительстве.</p>
</div>
</body>
</html>

CSS

background: -webkit-gradient(linear, left top, left bottom, color-stop(24%,#fcfeff), color-stop(74%,#e3eaed), color-stop(100%,#c8d7dc));
background: -o-linear-gradient(top, #fcfeff 24%,#e3eaed 74%,#c8d7dc 100%);
background: -ms-linear-gradient(top, #fcfeff 24%,#e3eaed 74%,#c8d7dc 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfeff', endColorstr='#c8d7dc',GradientType=0 );
width:400px;
margin:auto;
margin-top:50px;
padding:20px;
border-top:30px solid #FFF;
border-right:1px solid #FFF;
border-left:1px solid #FFF;
border-bottom:1px solid #FFF;
border-radius:8px;
-moz-border-radius:0px 0px 8px 8px;
-ms-border-radius:0px 0px 8px 8px;
-o-border-radius:0px 0px 8px 8px;
-webkit-border-radius:0px 0px 8px 8px;
position:relative;} 
div.inekg{width:130px; height:45px; background:#000; color:#FF9664; position:absolute;
left:-1px;
top:-30px;}
div.inekg:after{content:"";
border-bottom:43px solid #FFF;
border-left:25px solid transparent;
position:absolute;
right:0;
bottom:0;}
div.inekg p{font-size:1.8em;padding-left:15px; margin-top:5px; font-family:Arial, Helvetica, sans-serif; font-weight:bold;}