JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body{
padding:0px;
margin:0px;
}

.shadow{
width:400px;
margin:20px auto;
cursor:text;
color:#000;
position:relative;    
}

.bottom{
box-shadow:inset 0px -190px 190px -50px #add7f8;
}

.top{
box-shadow:inset 0px 190px 190px -50px #add7f8;
}

.left{
box-shadow:inset 190px 0px 190px -50px #add7f8;
}

.right{
box-shadow:inset -190px 0px 190px -50px #add7f8;
}

.text{
color:#000;
position:relative;
z-index:-1;
background:red;    
}
</style>
</head>

<body>
<div style="background: red; position:relative; z-index:1;">
        <div class="shadow bottom">
        <div class="text">
             Все счастливые семьи похожи друг на друга,  каждая  несчастливая  семья
            несчастлива по-своему.
                 Все смешалось в доме Облонских. Жена узнала, что  муж  был  в  связи  с
            бывшею в их доме француженкою-гувернанткой, и объявила мужу,  что  не  может
            жить с ним в одном доме.  Положение  это  продолжалось  уже  третий  день  и
            мучительно чувствовалось и  самими  супругами,  и  всеми  членами  семьи,  и
            домочадцами. Все члены семьи и домочадцы чувствовали, что нет  смысла  в  их
            сожительстве и что на каждом постоялом дворе случайно сошедшиеся люди  более
            связаны между собой, чем они, члены семьи и  домочадцы  Облонских.  Жена  не
            выходила из своих комнат, мужа третий день не  было  дома.
        </div>
    </div>
</div>
</body>
</html>