<style>
    .header h4 {
        position: relative;
        top: 0.9em;
    }
    .header h2 {
        text-transform: uppercase;
        font-size: 14px;
        color: #aaa;
        margin: 0.75em 0;
    }
    .header p {
        font-size: 24px;
        color: black;
        font-weight: 600;
    }
</style>

<div class="row header">
    <div class="col-xs-1">
        <div class="<%= nodecolors.statuscolor %> nodecolor"></div>
    </div>

    <div class="col-xs-2">
        <img src="<%= nodeimgurl %>" />
    </div>

    <div class="col-xs-4">
        <h4><%= node.vanityname %></h4>
    </div>

    <% if (channels['multisensor.an0ispond'].value === 'true' || channels['multisensor.an1ispond'].value === 'true' || channels['multisensor.an2ispond'].value === 'true' || channels['multisensor.an3ispond'].value === 'true' || channels['multisensor.an4ispond'].value === 'true' || channels['multisensor.an5ispond'].value === 'true' || channels['multisensor.an6ispond'].value === 'true' || channels['multisensor.an7ispond'].value === 'true') { %>
        <div class="col-xs-4" style="text-align:center;">
            <h2>Pond Volume Total</h2>
            <h4><%= Math.round(channels['multisensor.pondvolumetotal'].value) %> BBL</h4>
        </div>
    <% } %>
</div>
