%%html
<style>
.mermaid *{font-family: sans-serif; }
.mermaid {
width: 100%;
max-height: 80vh;
overflow: auto;
}
.mermaid .node, .mermaid .cluster{
fill: white !important;
stroke: black !important;
stroke-width: 1px !important;
}
.mermaid div{
text-align: center;
}
.mermaid .label{
color: black;
}
</style>
<script>
require(
["//cdn.rawgit.com/bollwyvl/53e64cdafba38461943b/raw/0815758d591dfaf0f4918b388aed1bf11d82160d/mermaid.full.js"],
function(){ mermaid.init(); });
require(
["base/js/events"],
function(events){
events.on("rendered.MarkdownCell", function(evt, data){
mermaid.init(undefined, data.cell.element.find(".mermaid"));
});
});
</script>