<!-- @import "/app/monitor/components/drilltable.kit" -->
<div class="drillcontainer" id="unitdetails">
    <div class="row tools detailtools">
        <div class="col-12 text-right">
            <ul>
                <li class="dropdown notifications hidden-sm-down">
                    <a href="javascript:void(0);" class="dropdown-toggle" role="button">
                        <i class="icon icon-export" data-toggle="tooltip" data-original-title="Export"></i>

                    </a>
                    <div class="dropdown-menu " aria-labelledby="gaergrdsdz">

                        <div>
                            <p>Export as:</p>

                            <a href="#"><i class="icon icon-file-excel"> CSV</i></a>
                            <a href="#"><i class="icon icon-file-image"> Image</i></a>

                        </div>
                    </div>
                </li>
                <li>
                    <i class="icon icon-max maximize" data-toggle="tooltip" data-original-title="Maximize"></i>
                </li>
                <li>
                    <a href="/app/monitor/pages/drilltable_detail.html" target="_blank">
                        <i class="icon icon-newwin" data-toggle="tooltip" data-original-title="Open in new window"></i>
                    </a>
                </li>
                <li>
                    <i class="icon icon-close closeDetail" data-toggle="tooltip" data-original-title="Close"></i>
                </li>
            </ul>
        </div>
    </div>
    <div class="row statusrow">
        <div class="col-8 unitdescription">
            <h3>HY01</h3>
            <p>Aquamatic V164, 9.5 MW | SN: 52134 | Unit time: 04.18.2017 - 22:30</p>
        </div>
        <div class="col-4 text-right  status unitdescription">
            <div class="text-left statusbox">
                <div class="statusgroup">
                    <div class="left">
                        <h4>Status:
                        </h4>
                    </div>
                    <div class="right statusboxtext">
                        <p>
                            <span class="icon-stack">
                                <i class="icon-tri_bg"></i>
                                <i class="icon-warning color-warning"></i>
                            </span>
                            <span>Warning</span>
                        </p>
                    </div>
                </div>
                <div class="statusgroup">

                    <div class="left">
                        <p>OEM Status:</p>
                    </div>
                    <div class="right">
                        <p data-toggle="tooltip" data-html="true" title="<strong>Stopped </strong><br>Lorem ipsum dolor sit ametum dol orem ipsum dolor sit
                            ametum dolor sit amet. Lorem ipsum dolor sit ametum dol orem ipsum dolor sit
                            ametum dolor sit amet.</p>">
                            <span>Stopped </span>- Lorem ipsum dolor sit ametum dol orem ipsum dolor sit
                            ametum dolor sit amet. Lorem ipsum dolor sit ametum dol orem ipsum dolor sit
                            ametum dolor sit amet.
                        </p>
                    </div>
                </div>
                <div class="statusgroup">
                    <div class="left">
                        <p>Active alarm:</p>
                    </div>
                    <div class="right">
                        <p data-toggle="tooltip" data-html="true"
                            title="<strong>10.01.2018 10:22</strong><br>Generator temperature too hot"><span>10.01.2018
                                10:22 - Generator temperature too hot</span></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <ul class="nav nav-tabs" role="tablist">
        <li class="nav-item">
            <a class="nav-link active " href="#turbines" role="tab" data-toggle="tab">Turbines</a>
        </li>
        <li class="nav-item">
            <a class="nav-link " href="#lubrication" role="tab" data-toggle="tab" id="lubricationTab">Lubrication</a>
        </li>
        <li class="nav-item">
            <a class="nav-link " href="#electrical" role="tab" data-toggle="tab" id="counterTab">Electrical</a>
        </li>
        <li class="nav-item">
            <a class="nav-link " href="#events" role="tab" data-toggle="tab" id="eventsTab">Events</a>
        </li>
    </ul>
    <div class="tab-content">
        <div role="tabpanel" class="tab-pane active" id="turbines">
            <div class="gridwrapper">

            </div>
        </div>
        <div role="tabpanel" class="tab-pane" id="lubrication">
            <div class="gridwrapper">
                <div class="frame  full notlr nomax">
                    <h3>Lubrication</h3>

                    <style type="text/css">
                        .waterflowsvg {
                            display: block;
                            width: 90%;
                            margin: auto;
                            height: auto;
                        }

                        .waterflowsvg path,
                        .waterflowsvg line,
                        .waterflowsvg rect {
                            fill: none;
                        }

                        .theme-dark .waterflowsvg path,
                        .theme-dark .waterflowsvg line,
                        .theme-dark .waterflowsvg rect {
                            stroke: #ffffff;
                        }

                        .theme-light .waterflowsvg path,
                        .theme-light .waterflowsvg line,
                        .theme-light .waterflowsvg rect {
                            stroke: #555555;
                        }

                        .waterflowsvg .bgbox {
                            stroke: none !important;
                        }

                        .theme-dark .waterflowsvg .bgbox {
                            fill: #2c2c2c;
                        }

                        .theme-light .waterflowsvg .bgbox {
                            fill: #dddddd;
                        }

                        .waterflowsvg .barbg {
                            stroke: none !important;
                        }

                        .theme-dark .waterflowsvg .barbg {
                            fill: #666;
                        }

                        .theme-light .waterflowsvg .barbg {
                            fill: #ccc;
                        }

                        .theme-dark .waterflowsvg text {
                            fill: #ffffff;
                        }

                        .theme-light .waterflowsvg text {
                            fill: #555555;
                        }

                        .waterflowsvg .barvalue {
                            stroke: none !important;
                        }

                        .theme-dark .waterflowsvg .barvalue {
                            fill: #2D98DA;
                        }

                        .theme-light .waterflowsvg .barvalue {
                            fill: #2D98DA;
                        }

                        .waterflowsvg .description {
                            font-size: 14px;
                            font-weight: 500;
                        }

                        .theme-dark .waterflowsvg .description {
                            fill: #ffffff;
                        }

                        .theme-light .waterflowsvg .description {
                            fill: #555555;
                        }

                        .waterflowsvg .bigtext {
                            font-size: 24px;
                            font-weight: 500;
                        }

                        .theme-dark .waterflowsvg .bigtext {
                            fill: #ffffff;
                        }

                        .theme-light .waterflowsvg .bigtext {
                            fill: #555555;
                        }

                        .waterflowsvg .bigcircle {
                            fill: none;
                        }

                        .theme-dark .waterflowsvg .bigcircle {
                            stroke: #ffffff;
                        }

                        .theme-light .waterflowsvg .bigcircle {
                            stroke: #555555;
                        }

                        .waterflowsvg .ok {
                            fill: #20bf6b;
                        }

                        .waterflowsvg .alert {
                            fill: #d52e2b;
                        }
                    </style>
                    <svg xmlns="http://www.w3.org/2000/svg" width="1286.981" height="500.183"
                        viewBox="0 0 1286.981 500.183" class="waterflowsvg">

                        <g id="Group_11190" data-name="Group 11190" transform="translate(-528.519 -552.448)">
                            <g id="Group_11189" data-name="Group 11189">
                                <g id="Group_10938" data-name="Group 10938">
                                    <path id="Path_2270" data-name="Path 2270" d="M816.851,371.78H-25.8l0,210.764"
                                        transform="translate(572.676 199.423)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2273" data-name="Path 2273" d="M448.136,392.78v178.2"
                                        transform="translate(940.594 178.423)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2275" data-name="Path 2275" d="M339.941,490.227V309.363H426.3"
                                        transform="translate(1164.584 258.647)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <rect id="Rectangle_17045" data-name="Rectangle 17045" width="174.512"
                                        height="183.539" transform="translate(1363.109 719.538)" fill="none"
                                        stroke="#fff" stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_920" data-name="Line 920" x2="173.463"
                                        transform="translate(1363.406 763.918)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_921" data-name="Line 921" x2="13.946"
                                        transform="translate(1375.416 789.046)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_922" data-name="Line 922" x2="13.946"
                                        transform="translate(1429.123 789.11)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_923" data-name="Line 923" x2="13.946"
                                        transform="translate(1455.977 789.498)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_924" data-name="Line 924" x2="13.946"
                                        transform="translate(1482.83 789.498)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_925" data-name="Line 925" x2="13.946"
                                        transform="translate(1509.684 789.11)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_926" data-name="Line 926" x2="13.946"
                                        transform="translate(1402.27 789.498)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_927" data-name="Line 927" x2="13.946"
                                        transform="translate(1363.02 774.882)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_928" data-name="Line 928" x2="13.946"
                                        transform="translate(1416.727 774.946)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_929" data-name="Line 929" x2="13.946"
                                        transform="translate(1524.141 774.946)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_930" data-name="Line 930" x2="13.946"
                                        transform="translate(1443.58 775.334)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_931" data-name="Line 931" x2="13.946"
                                        transform="translate(1470.434 775.334)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_932" data-name="Line 932" x2="13.946"
                                        transform="translate(1497.287 774.946)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_933" data-name="Line 933" x2="13.946"
                                        transform="translate(1389.873 775.334)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_934" data-name="Line 934" x2="13.946"
                                        transform="translate(1363.504 803.209)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_935" data-name="Line 935" x2="13.946"
                                        transform="translate(1417.211 803.274)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_936" data-name="Line 936" x2="13.946"
                                        transform="translate(1524.625 803.274)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_937" data-name="Line 937" x2="13.946"
                                        transform="translate(1444.064 803.662)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_938" data-name="Line 938" x2="13.946"
                                        transform="translate(1470.918 803.662)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_939" data-name="Line 939" x2="13.946"
                                        transform="translate(1497.771 803.274)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_940" data-name="Line 940" x2="13.946"
                                        transform="translate(1390.357 803.662)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_941" data-name="Line 941" x2="13.946"
                                        transform="translate(1362.344 831.537)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_942" data-name="Line 942" x2="13.946"
                                        transform="translate(1416.051 831.602)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_943" data-name="Line 943" x2="13.946"
                                        transform="translate(1523.465 831.602)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_944" data-name="Line 944" x2="13.946"
                                        transform="translate(1442.904 831.989)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_945" data-name="Line 945" x2="13.946"
                                        transform="translate(1469.758 831.989)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_946" data-name="Line 946" x2="13.946"
                                        transform="translate(1496.611 831.602)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_947" data-name="Line 947" x2="13.946"
                                        transform="translate(1389.197 831.989)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_948" data-name="Line 948" x2="13.946"
                                        transform="translate(1363.117 859.865)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_949" data-name="Line 949" x2="13.946"
                                        transform="translate(1416.824 859.929)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_950" data-name="Line 950" x2="13.946"
                                        transform="translate(1524.238 859.929)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_951" data-name="Line 951" x2="13.946"
                                        transform="translate(1443.678 860.317)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_952" data-name="Line 952" x2="13.946"
                                        transform="translate(1470.531 860.317)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_953" data-name="Line 953" x2="13.946"
                                        transform="translate(1497.385 859.929)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_954" data-name="Line 954" x2="13.946"
                                        transform="translate(1389.971 860.317)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_955" data-name="Line 955" x2="13.946"
                                        transform="translate(1364.279 888.192)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_956" data-name="Line 956" x2="13.946"
                                        transform="translate(1417.986 888.257)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_957" data-name="Line 957" x2="13.946"
                                        transform="translate(1525.4 888.257)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_958" data-name="Line 958" x2="13.946"
                                        transform="translate(1444.84 888.645)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_959" data-name="Line 959" x2="13.946"
                                        transform="translate(1471.693 888.645)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_960" data-name="Line 960" x2="13.946"
                                        transform="translate(1498.547 888.257)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_961" data-name="Line 961" x2="13.946"
                                        transform="translate(1391.133 888.645)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_962" data-name="Line 962" x2="13.946"
                                        transform="translate(1375.416 817.374)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_963" data-name="Line 963" x2="13.946"
                                        transform="translate(1429.123 817.438)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_964" data-name="Line 964" x2="13.946"
                                        transform="translate(1455.977 817.826)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_965" data-name="Line 965" x2="13.946"
                                        transform="translate(1482.83 817.826)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_966" data-name="Line 966" x2="13.946"
                                        transform="translate(1509.684 817.438)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_967" data-name="Line 967" x2="13.946"
                                        transform="translate(1402.27 817.826)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_968" data-name="Line 968" x2="13.946"
                                        transform="translate(1375.416 845.701)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_969" data-name="Line 969" x2="13.946"
                                        transform="translate(1429.123 845.766)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_970" data-name="Line 970" x2="13.946"
                                        transform="translate(1455.977 846.153)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_971" data-name="Line 971" x2="13.946"
                                        transform="translate(1482.83 846.153)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_972" data-name="Line 972" x2="13.946"
                                        transform="translate(1509.684 845.766)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_973" data-name="Line 973" x2="13.946"
                                        transform="translate(1402.27 846.153)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_974" data-name="Line 974" x2="13.946"
                                        transform="translate(1375.416 874.029)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <g id="Group_10937" data-name="Group 10937">
                                        <rect id="Rectangle_17120" class="bgbox" data-name="Rectangle 17120" width="94"
                                            height="263" rx="6" transform="translate(1552.5 767.5) rotate(-90)"
                                            fill="#2c2c2c" />
                                        <rect id="Rectangle_17121" class="bgbox" data-name="Rectangle 17121" width="141"
                                            height="184" rx="6" transform="translate(1138 639)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17123" class="bgbox" data-name="Rectangle 17123" width="141"
                                            height="212" rx="6" transform="translate(1138 828)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17122" class="bgbox" data-name="Rectangle 17122" width="119"
                                            height="184" rx="6" transform="translate(829 639)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17116" class="bgbox" data-name="Rectangle 17116" width="119"
                                            height="184" rx="6" transform="translate(967 639)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17119" class="bgbox" data-name="Rectangle 17119" width="119"
                                            height="184" rx="6" transform="translate(967 828)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17124" class="bgbox" data-name="Rectangle 17124" width="119"
                                            height="184" rx="6" transform="translate(829 828)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17383" class="bgbox" data-name="Rectangle 17383" width="119"
                                            height="176" rx="6" transform="translate(674 803)" fill="#2c2c2c" />
                                        <rect id="Rectangle_17382" class="bgbox" data-name="Rectangle 17382" width="119"
                                            height="179" rx="6" transform="translate(674 585)" fill="#2c2c2c" />

                                    </g>
                                    <line id="Line_975" data-name="Line 975" x2="13.946"
                                        transform="translate(1429.123 874.093)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_976" data-name="Line 976" x2="13.946"
                                        transform="translate(1455.977 874.481)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_977" data-name="Line 977" x2="13.946"
                                        transform="translate(1482.83 874.481)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_978" data-name="Line 978" x2="13.946"
                                        transform="translate(1509.684 874.093)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_979" data-name="Line 979" x2="13.946"
                                        transform="translate(1402.27 874.481)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <g id="Group_11179" data-name="Group 11179" transform="translate(24.943)">
                                        <path id="Path_2280" data-name="Path 2280"
                                            d="M231.64,377.777a22.945,22.945,0,1,0,1.527,39.66,64.225,64.225,0,0,1-1.527-39.66Z"
                                            transform="translate(1107.051 498.67) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2281" data-name="Path 2281"
                                            d="M207.558,375.875a22.909,22.909,0,0,1,1.527,39.66"
                                            transform="translate(1105.15 522.752) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2282" data-name="Path 2282"
                                            d="M203.819,393.3a65.291,65.291,0,0,0-2.424-17.443"
                                            transform="translate(1105.195 507.229) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2283" data-name="Path 2283"
                                            d="M200.961,403.031a65.139,65.139,0,0,0,3.952-22.217"
                                            transform="translate(1092.711 506.137) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                    </g>
                                    <path id="Path_2299" data-name="Path 2299" d="M0,170.022V20"
                                        transform="translate(616.127 750.094)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2300" data-name="Path 2300" d="M0,170.228V20"
                                        transform="translate(629.551 750.094)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <g id="Group_11181" data-name="Group 11181" transform="translate(0 47)">
                                        <path id="Path_2284" data-name="Path 2284"
                                            d="M240.041,340.157H282l-7.866,36.335h-26.6Z"
                                            transform="translate(361.975 532.959)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <line id="Line_982" data-name="Line 982" y2="6.743"
                                            transform="translate(616.127 909.611)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <line id="Line_983" data-name="Line 983" y2="7.492"
                                            transform="translate(629.551 909.236)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2285" data-name="Path 2285"
                                            d="M260.99,371.8l-34.464-7.493s-14.233,19.1,1.124,36.336l42.7-8.99s-9.363-1.5-9.363-8.99l.373-27.346h67.8V371.8l34.464-7.118s14.609,17.232.376,36.336l-34.464-7.866v15.732s0,19.852-25.846,35.96H289.832s-28.469-14.984-28.469-36.336V395.026"
                                            transform="translate(326.793 560.285)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <line id="Line_984" data-name="Line 984" x2="68.175"
                                            transform="translate(588.156 968.797)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2286" data-name="Path 2286"
                                            d="M264.724,382.552l-.376-10.865s0-6.742-7.866-8.99l7.866-1.5"
                                            transform="translate(391.609 570.887)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2287" data-name="Path 2287"
                                            d="M302.173,393.392,235.5,358.928a44.867,44.867,0,0,0,35.587,17.607C282.346,376.535,297.678,380.655,302.173,393.392Z"
                                            transform="translate(353.783 566.79)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                    </g>
                                    <path id="Path_2288" data-name="Path 2288" d="M227.193,412.3h69.634V642.239H227.193"
                                        transform="translate(1003.863 307.698)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <rect id="Rectangle_17047" data-name="Rectangle 17047" width="24.929" height="53.15"
                                        transform="translate(899.051 732.861) rotate(180)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_990" data-name="Line 990" x2="24.458"
                                        transform="translate(899.051 707.462) rotate(180)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_991" data-name="Line 991" x2="5.731"
                                        transform="translate(898.668 719.674) rotate(180)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_992" data-name="Line 992" x2="5.731"
                                        transform="translate(879.732 719.691) rotate(180)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <rect id="Rectangle_17048" data-name="Rectangle 17048" width="8.937" height="8.937"
                                        transform="translate(890.584 741.798) rotate(180)" fill="#fff" />
                                    <line id="Line_1103" data-name="Line 1103" x2="24.458"
                                        transform="translate(899.051 693.462) rotate(180)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_988" data-name="Line 988" y1="231"
                                        transform="translate(1114.5 720.5)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_989" data-name="Line 989" x1="32.508"
                                        transform="translate(1300.992 812.059)" fill="#fff" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2301" data-name="Path 2301" d="M10,0H149.529"
                                        transform="translate(1590.461 717.539) rotate(-90)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2289" data-name="Path 2289" d="M396.524,423.315v193.8l-7.934,13.248"
                                        transform="translate(1194.461 392.261)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_994" data-name="Line 994" x1="8.514" y1="13.126"
                                        transform="translate(1590.986 1009.374)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <rect id="Rectangle_17050" data-name="Rectangle 17050" width="31.909"
                                        height="31.909" transform="translate(1613.041 792.842) rotate(135)" fill="none"
                                        stroke="#fff" stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_996" data-name="Line 996" y2="45.126"
                                        transform="translate(1613.041 792.842) rotate(90)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" stroke-dasharray="1.5 1" />
                                    <line id="Line_1005" data-name="Line 1005" y1="34.336"
                                        transform="translate(1604.381 895.296)" fill="#fff" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2294" data-name="Path 2294" d="M389.193,430.951h6.7L392.964,420.9Z"
                                        transform="translate(1211.639 464.846)" stroke="#fff" stroke-width="1" />
                                    <line id="Line_1006" data-name="Line 1006" x1="22.478"
                                        transform="translate(1353.049 939.338)" fill="#fff" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2295" data-name="Path 2295" d="M296.56,443.071v-6.7L286.5,439.3Z"
                                        transform="translate(1056.99 499.816)" stroke="#fff" stroke-width="1" />
                                    <line id="Line_1007" data-name="Line 1007" x2="34.336"
                                        transform="translate(1092.646 556.718)" fill="#fff" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2296" data-name="Path 2296" d="M274.849,330.076v6.7l10.056-2.933Z"
                                        transform="translate(851.633 223.093)" stroke="#fff" stroke-width="1" />
                                    <path id="Path_2291" data-name="Path 2291" d="M345.942,401.056l8.937-6.731v11.288Z"
                                        transform="translate(1991.313 352.337) rotate(90)" fill="#fff" />
                                    <line id="Line_997" data-name="Line 997" y2="9.483"
                                        transform="translate(1622.221 720.758) rotate(90)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <text id="M" transform="translate(1633.236 729.638)" fill="#fff" font-size="24"
                                        font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                        <tspan x="0" y="0">M</tspan>
                                    </text>
                                    <path id="Path_2290" data-name="Path 2290" d="M263.59,419.888l8.937-6.731v11.288Z"
                                        transform="translate(922.41 301.356)" fill="#fff" />
                                    <line id="Line_1001" data-name="Line 1001" y2="9.208"
                                        transform="translate(1208.48 689.558)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <text id="M-2" data-name="M" transform="translate(1197.139 676)" fill="#fff"
                                        font-size="24" font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                        <tspan x="0" y="0">M</tspan>
                                    </text>
                                    <rect id="Rectangle_17049" data-name="Rectangle 17049" width="31.909"
                                        height="31.909" transform="translate(1024.563 697.546) rotate(45)" fill="none"
                                        stroke="#fff" stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_995" data-name="Line 995" y2="45.126"
                                        transform="translate(1024.563 697.546)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" stroke-dasharray="1.5 1" />
                                    <rect id="Rectangle_17049-2" data-name="Rectangle 17049" width="31.909"
                                        height="31.909" transform="translate(1023.563 929) rotate(45)" fill="none"
                                        stroke="#fff" stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_995-2" data-name="Line 995" y2="45.126"
                                        transform="translate(1023.563 929)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" stroke-dasharray="1.5 1" />


                                    <g id="Group_10936" data-name="Group 10936">
                                        <text id="Fill_reservoir_pump_running" data-name="Fill reservoir pump running"
                                            transform="translate(1736 732)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-44.912" y="0">Fill reservoir </tspan>
                                            <tspan x="-52.283" y="18">pump running</tspan>
                                        </text>
                                        <text id="Circulation_pump_1_running" data-name="Circulation pump 1 running"
                                            transform="translate(1208 792)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-38.738" y="0">Circulation</tspan>
                                            <tspan x="-56.756" y="18">pump 1 running</tspan>
                                        </text>
                                        <text id="Circulation_pump_2_running" data-name="Circulation pump 2 running"
                                            transform="translate(1208 877)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-38.738" y="0">Circulation</tspan>
                                            <tspan x="-58.184" y="18">pump 2 running</tspan>
                                        </text>
                                        <text id="Work_through_filter_1" data-name="Work through filter 1"
                                            transform="translate(885 792)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-50.19" y="0">Work through</tspan>
                                            <tspan x="-21.427" y="18">filter 1</tspan>
                                        </text>
                                        <text id="Work_through_filter_1-2" data-name="Work through filter 1"
                                            transform="translate(1024 792)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-50.19" y="0">Work through</tspan>
                                            <tspan x="-21.427" y="18">filter 1</tspan>
                                        </text>
                                        <text id="Work_through_filter_2" data-name="Work through filter 2"
                                            transform="translate(1024 877)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-50.19" y="0">Work through</tspan>
                                            <tspan x="-22.855" y="18">filter 2</tspan>
                                        </text>
                                        <text id="Work_through_filter_2-2" data-name="Work through filter 2"
                                            transform="translate(885 877)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-50.19" y="0">Work through</tspan>
                                            <tspan x="-22.855" y="18">filter 2</tspan>
                                        </text>
                                    </g>
                                    <rect id="Rectangle_17051" data-name="Rectangle 17051" width="24.929" height="53.15"
                                        transform="translate(872.979 911.873)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_998" data-name="Line 998" x2="24.458"
                                        transform="translate(872.979 937.272)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_999" data-name="Line 999" x2="5.731"
                                        transform="translate(873.361 925.518)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_1000" data-name="Line 1000" x2="5.731"
                                        transform="translate(892.297 925.5)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <rect id="Rectangle_17052" data-name="Rectangle 17052" width="8.937" height="8.937"
                                        transform="translate(881.445 902.937)" fill="#fff" />
                                    <line id="Line_1003" data-name="Line 1003" x2="24.929"
                                        transform="translate(872.002 951.404)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2292" data-name="Path 2292" d="M263.59,472.034l8.937-6.731v11.288Z"
                                        transform="translate(922.41 478.7)" fill="#fff" />
                                    <line id="Line_1002" data-name="Line 1002" y2="7.568"
                                        transform="translate(1208.479 973.213)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <text id="M-3" data-name="M" transform="translate(1197.137 1011)" font-size="24"
                                        font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                        <tspan x="0" y="0">M</tspan>
                                    </text>
                                    <path id="Path_2777" data-name="Path 2777"
                                        d="M240.041,340.157H282l-7.866,36.335h-26.6Z"
                                        transform="translate(361.975 393.958)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2778" data-name="Path 2778" d="M0,123.182V71.643"
                                        transform="translate(616.127 611.094)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2779" data-name="Path 2779" d="M0,123.182V71"
                                        transform="translate(629.549 611.094)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2780" data-name="Path 2780" d="M278.324,333.78H204.2v14.928"
                                        transform="translate(432.676 385.423)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <g id="Group_11180" data-name="Group 11180" transform="translate(24.943)">
                                        <path id="Path_2280-2" data-name="Path 2280"
                                            d="M231.64,377.777a22.945,22.945,0,1,0,1.527,39.66,64.225,64.225,0,0,1-1.527-39.66Z"
                                            transform="translate(1107.051 621.67) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2281-2" data-name="Path 2281"
                                            d="M207.558,375.875a22.909,22.909,0,0,1,1.527,39.66"
                                            transform="translate(1105.15 645.752) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2282-2" data-name="Path 2282"
                                            d="M203.819,393.3a65.291,65.291,0,0,0-2.424-17.443"
                                            transform="translate(1105.195 630.229) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                        <path id="Path_2283-2" data-name="Path 2283"
                                            d="M200.961,403.031a65.139,65.139,0,0,0,3.952-22.217"
                                            transform="translate(1092.709 629.137) rotate(90)" fill="none" stroke="#fff"
                                            stroke-miterlimit="10" stroke-width="1" />
                                    </g>
                                    <path id="Path_2781" data-name="Path 2781"
                                        d="M20952.932,7707.606h18.926v122.527h-18.926"
                                        transform="translate(-20196 -6988)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2782" data-name="Path 2782" d="M20932,7828.059h-72.824v76.964"
                                        transform="translate(-20221 -6985)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2297" data-name="Path 2297" d="M11.523,0H-126.921"
                                        transform="translate(1174.055 720.301)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2783" data-name="Path 2783"
                                        d="M21606.094,7909.327v30.679h-52.074V7827.6"
                                        transform="translate(-20221 -7016)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2784" data-name="Path 2784" d="M10,0H37.043"
                                        transform="translate(1590.461 780.279) rotate(-90)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <line id="Line_1005-2" data-name="Line 1005" y1="34.336"
                                        transform="translate(1535.793 556.49) rotate(-90)" fill="#fff" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2294-2" data-name="Path 2294" d="M389.193,430.951h6.7L392.964,420.9Z"
                                        transform="translate(1105.344 949.23) rotate(-90)" stroke="#fff"
                                        stroke-width="1" />
                                    <g id="Rectangle_17320" data-name="Rectangle 17320" transform="translate(577 623)"
                                        fill="none" stroke="#fff" stroke-width="1">
                                        <rect width="90" height="60" stroke="none" />
                                        <rect x="0.5" y="0.5" width="89" height="59" fill="none" />
                                    </g>
                                    <path id="Path_2785" data-name="Path 2785"
                                        d="M20828.8,7722.276V7708.05h-34.463v123.145h34.463v77.126"
                                        transform="translate(-20221 -6988)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2786" data-name="Path 2786" d="M20794.34,7798.059h-26.953"
                                        transform="translate(-20221 -7016)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2271" data-name="Path 2271" d="M203.373,544.95h22.638V483.18H307"
                                        transform="translate(572.676 237.109)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2787" data-name="Path 2787" d="M21113.871,7736.29h110.012"
                                        transform="translate(-20221 -7016)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <path id="Path_2272" data-name="Path 2272" d="M186.494,579.879H110.4v-169"
                                        transform="translate(688.291 371.621)" fill="none" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <line id="Line_987" data-name="Line 987" x1="126" transform="translate(876.5 951.5)"
                                        fill="none" stroke="#fff" stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2298" data-name="Path 2298" d="M139.936,0H0"
                                        transform="translate(1046.129 951.5)" fill="none" stroke="#fff"
                                        stroke-width="1" />
                                    <line id="Line_1007-2" data-name="Line 1007" x2="34.336"
                                        transform="translate(532.787 690.467) rotate(-90)" fill="#fff" stroke="#fff"
                                        stroke-miterlimit="10" stroke-width="1" />
                                    <path id="Path_2296-2" data-name="Path 2296" d="M274.849,330.076v6.7l10.056-2.933Z"
                                        transform="translate(199.164 931.48) rotate(-90)" stroke="#fff"
                                        stroke-width="1" />
                                </g>


                                <g id="Group_10935" data-name="Group 10935">
                                    <circle id="Ellipse_1452" class="ok" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(1724 688.612)" />
                                    <circle id="Ellipse_1446" class="alert" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(1196 747.769)" />
                                    <circle id="Ellipse_1447" class="ok" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(1196 836.223)" />
                                    <circle id="Ellipse_1451" class="ok" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(873 747.769)" />
                                    <circle id="Ellipse_1450" class="ok" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(1012 747.769)" />
                                    <circle id="Ellipse_1449" class="ok" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(1012 836.223)" />
                                    <circle id="Ellipse_1448" class="ok" cx="11.994" cy="11.994" r="11.994"
                                        transform="translate(873 836.223)" />

                                    <circle id="Ellipse_1440" class="bigcircle" cx="22.479" cy="22.479" r="22.479"
                                        transform="translate(1186 928.255)" />
                                    <circle id="Ellipse_1443" class="bigcircle" cx="22.479" cy="22.479" r="22.479"
                                        transform="translate(1186 980.781)" />
                                    <circle id="Ellipse_1439" class="bigcircle" cx="22.479" cy="22.479" r="22.479"
                                        transform="translate(1612.736 698.279) rotate(90)" />
                                    <circle id="Ellipse_1441" class="bigcircle" cx="22.479" cy="22.479" r="22.479"
                                        transform="translate(1667.178 698.279) rotate(90)" />
                                    <circle id="Ellipse_1438" class="bigcircle" cx="22.479" cy="22.479" r="22.479"
                                        transform="translate(1186 698.766)" />
                                    <circle id="Ellipse_1442" class="bigcircle" cx="22.479" cy="22.479" r="22.479"
                                        transform="translate(1186 644.6)" />
                                </g>



                                <!-- Bearing high and low value bars -->


                                <g>
                                    <text id="Water_flow_at_bearing_higher" transform="translate(734 610)"
                                        font-size="14" font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                        <tspan x="-40.432" y="0">Water flow </tspan>
                                        <tspan x="-38.381" y="18">at bearing </tspan>
                                        <tspan x="-23.492" y="36">higher</tspan>
                                    </text>
                                    <g transform="translate(-864 208)">
                                        <rect width="100" height="24" transform="translate(1547 452)" class="barbg" />
                                        <g transform="translate(1547 452)">
                                            <rect id="bar_higher" width="63" height="24" class="barvalue" />

                                            <!-- Set rect width = % -->

                                        </g>
                                        <text id="value_higher" transform="translate(1603 469)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-26.32" y="0">14.2 l/m</tspan>
                                        </text>
                                    </g>
                                </g>

                                <g>
                                    <text id="Water_flow_at_bearing_Lower" transform="translate(734 926)" font-size="14"
                                        font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                        <tspan x="-40.432" y="0">Water flow </tspan>
                                        <tspan x="-38.381" y="18">at bearing </tspan>
                                        <tspan x="-21.791" y="36">Lower</tspan>
                                    </text>
                                    <g transform="translate(-864 426)">
                                        <rect width="100" height="24" transform="translate(1547 452)" class="barbg" />
                                        <g transform="translate(1547 452)">
                                            <rect id="bar_lower" width="20" height="24" stroke="none"
                                                class="barvalue" />

                                            <!-- Set rect width = % -->


                                        </g>
                                        <text id="value_lower" transform="translate(1603 469)" font-size="14"
                                            font-family="Montserrat-Medium, Montserrat" font-weight="500">
                                            <tspan x="-26.32" y="0">10.2 l/m</tspan>
                                        </text>
                                    </g>
                                </g>
                            </g>
                        </g>
                    </svg>


                </div>

            </div>
        </div>
        <div role="tabpanel" class="tab-pane" id="electrical">
            <div class="gridwrapper">
                <div class="frame half">
                    <h3>Power System</h3>
                    <div class="row">
                        <div class="col-4">
                            <div class="unitgraphwrapper power" style="min-height:180px;">
                                <div class="min">
                                    <h6>0 kW</h6>
                                </div>
                                <div class="max">
                                    <h6>3.000 kW</h6>
                                </div>
                                <div class="base">
                                    <div class="valuebar power" style="height:40%;"></div>
                                    <div class="value" style="height:40%;">
                                        <h4>150
                                            <span>kW</span>
                                        </h4>
                                    </div>
                                </div>
                                <div class="valuelines"></div>
                                <div class="graphtop"></div>
                                <div class="graphbottom"></div>
                            </div>
                            <h6>Power</h6>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col">
                            <h4>691
                                <span>v</span>
                            </h4>
                            <h6>Voltage L1</h6>
                            <h4>250
                                <span>A</span>
                            </h4>
                            <h6>Current L1</h6>
                            <h4>1.00</h4>
                            <h6>Power Factor</h6>
                        </div>
                        <div class="col">
                            <h4>691
                                <span>v</span>
                            </h4>
                            <h6>Voltage L2</h6>

                            <h4>250
                                <span>A</span>
                            </h4>
                            <h6>Current L2</h6>
                            <h4>50.63
                                <span>Hz</span>
                            </h4>
                            <h6>Frequency</h6>
                        </div>

                        <div class="col">
                            <h4>691
                                <span>v</span>
                            </h4>
                            <h6>Voltage L3</h6>
                            <h4>250
                                <span>A</span>
                            </h4>
                            <h6>Current L3</h6>
                            <h4>-12.1
                                <span>kVAr</span>
                            </h4>
                            <h6>Reactive Power</h6>
                        </div>
                    </div>
                </div>
                <div class="frame half">Single line diagram goes here</div>
            </div>
        </div>

        <div role="tabpanel" class="tab-pane" id="events">
            <div class="gridwrapper">
                <div class="frame  full notlr">
                    <h3>Events</h3>
                </div>

            </div>
        </div>
    </div>
</div>