JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>
<head>
    <title>second task</title>
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
    <style type="text/css">
        body {
            font-size: 14pt;
        }
        #mainbox {
            width: 95%;
            margin: 10px auto;
        }
        #top {
            height: 25px;
            background: red;
            overflow-y: hidden;
            border-radius:10px 10px 0 0;
            box-shadow: 0 0px 3px black;
            z-index: 3;
            position: relative;
            background: #c9e39c;
            padding: 2px 0 0 0;
        }
        #content{
            background: red;
            z-index: 2;
            position: relative;
            box-shadow: 0 0 3px black;
            background: #c9e39c;
            padding: 10px;
            min-height: 100px;
        }
        p {
            padding: 0;
            margin: 0;
            font-size: 12pt;
            
        }
        #dolog {
            position: relative;
            padding: 0 4px 0 8px;
            border-bottom: 4px #c9e39c solid;
        }
    </style>
</head>

<body>
    <div id='mainbox'>
        <span id="top" >
            <span id="dolog">
                <b>Заголовок</b>
            </span>
        </span>
        <div id="content">
            <p>Содержание блока</p>
        </div>
    </div>
</body>
</html>