<!DOCTYPE html>
<html style="height: 100%; margin: 0; padding: 0;">
<head>
<meta charset="utf-8">
<title>Script Viewer</title>
</head>
<body style="display: flex; flex-flow: column; height: 100%; width: 100%; margin: 0; padding: 0;">
<div style="display: flex; background: #cfcfcf; flex-flow: row; width: 100%; height: 50px;">
<div style="display: flex; flex-flow: row; width: 100%; height: 100%; overflow: scroll;">
<p style="margin: 0 5px 0 5px; padding: 0;"><a href=""><b>Script Hierarchy</b></a></p>
<p style="margin: 0 5px 0 5px; padding: 0;">>></p>
<p style="margin: 0 5px 0 5px; padding: 0;"><a href="">Base BB 1</a></p>
<p style="margin: 0 5px 0 5px; padding: 0;">>></p>
<p style="margin: 0 5px 0 5px; padding: 0;"><a href="">Base BB 1</a></p>
<p style="margin: 0 5px 0 5px; padding: 0;">>></p>
<p style="margin: 0 5px 0 5px; padding: 0;"><a href="">Base BB 1</a></p>
<p style="margin: 0 5px 0 5px; padding: 0;">>></p>
<p style="margin: 0 5px 0 5px; padding: 0;"><a href="">Base BB 1</a></p>
<p style="margin: 0 5px 0 5px; padding: 0;">>></p>
<p style="margin: 0 5px 0 5px; padding: 0;"><b>Current BB</b></p>
</div>
<div style="width: 100px;">
<button style="width: 100px; height: 50px;">SAVE !!</button>
</div>
</div>
<div style="background: #7f7f7f; width: 100%; height: 100%; overflow: scroll; position: relative;">
<div>
<div
style="position: absolute; height: 50px; width: 200px; top: 200px; left: 300px; background: #8f8f8f; border: 1px solid #cfcfcf;">
<div style="position: absolute; height: 6px; width: 6px; top: 0; left: 20px; background: blue;"></div>
<div style="position: absolute; height: 6px; width: 6px; top: 0; left: 35px; background: blue;"></div>
<div style="position: absolute; height: 6px; width: 6px; bottom: 0; left: 20px; background: blue;">
</div>
<div style="position: absolute; height: 6px; width: 6px; top: 10px; left: 0; background: yellow;"></div>
<div style="position: absolute; height: 6px; width: 6px; top: 10px; right: 0; background: yellow;">
</div>
<p style="position: absolute; top: 10px; left: 10px; margin: 0; padding: 0;">Get Cell</p>
</div>
<svg version="1.1" width="1000px" height="1000px" style="position: absolute; top: 0; left: 0;">
<line x1="502" y1="210" x2="100" y2="100" stroke="black" stroke-width="1px"></line>
<line x1="320" y1="200" x2="100" y2="100" stroke="blue" stroke-width="1px" stroke-dasharray="10, 5">
</line>
<text x="200" y="155" fill="black">0</text>
</svg>
</div>
</div>
</body>
</html>