JSFiddle - React, Tailwind, and code Playground

HTML

<div class="monster">
    <div class="body">
        <div class="skin">
            <div class="row odd">
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
            </div>
            <div class="row even">
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
            </div>
            <div class="row odd">
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
            </div>
            <div class="row even">
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
            </div>
            <div class="row odd">
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
            </div>
            <div class="row even">
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
                <div class="boob"></div>
            </div>
            <div class="row odd">
                <div class="boob"></div>
                <div class="boob"></div>
            ...

CSS

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body {
    background-image: -webkit-radial-gradient(center, circle cover, #A3FAE5, #83A6FF);
    background-image: -moz-radial-gradient(center, circle cover, #A3FAE5, #83A6FF);
    background-image: radial-gradient(center, circle cover, #A3FAE5, #83A6FF);
}
.monster {
	width: 154px;
	height: 400px;
	margin: 20px auto;
}
.body {
	position: relative;
	width: 100%;
	height: 100%;
	padding: 10px;
	border: 2px solid #353535;
	border-radius: 75px;
	background: linear-gradient(to bottom, #A5162C, #E01F1F);
	-webkit-box-shadow: inset 15px -15px 25px #7A0000;
	-moz-box-shadow: inset 15px -15px 25px #7A0000;
	box-shadow: inset 15px -15px 25px #7A0000;
}
.body:before {
	left: 10px;
	bottom: 5px;
	width: 110%;
	height: 150px;
	-webkit-box-shadow: -195px 5px 26px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: -195px 5px 26px rgba(0, 0, 0, 0.4);
	box-shadow: -195px 5px 26px rgba(0, 0, 0, 0.4);
	border-radius: 60px;
	-webkit-transform: skew(50deg);
	-moz-transform: skew(50deg);
	-ms-transform: skew(50deg);
	-o-transform: skew(50deg);
	transform: skew(50deg);
	-webkit-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	transform-origin: 0 0;
}
.body:before {
	content: "";
	position: absolute;
	z-index: -1;
}
.skin {
	position: absolute;
	overflow: hidden;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 75px;
}
.eye {
	position: relative;
	width: 130px;
	height: 130px;
	padding: 41px;
	border-radius: 50%;
	background-color: white;
	-webkit-box-shadow: inset 10px -10px 15px #CCC;
	-moz-box-shadow: inset 10px -10px 15px #CCC;
	box-shadow: inset 10px -10px 15px #CCC;
}
.apple-outer {
	position: relative;
	width: 48px;
	height: 48px;
	padding: 16px;
	border-radius: 50%;
	background: linear-gradient(to bottom right, #0C1809, #EBFF00);
	border: 1px solid #008000;
}
.apple-outer .hotspot {
	position: absolute;
	left: 14px;
	top:...