<!-- @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>

               <!--      <svg xmlns="http://www.w3.org/2000/svg" width="1236.202" height="597" viewBox="0 0 1236.202 597"
                        class="waterflowsvg">
                        <g transform="translate(-561 -467)">
                            <rect class="bgbox" width="119" height="184" rx="6" transform="translate(822 691)" />
                            <rect class="bgbox" width="267" height="71" rx="6" transform="translate(1279 620)" />
                            <rect class="bgbox" width="261" height="71" rx="6" transform="translate(561 620)" />
                            <rect class="bgbox" width="119" height="184" rx="6" transform="translate(822 880)" />
                            <rect class="bgbox" width="141" height="196" rx="6" transform="translate(1554 620)" />
                            <rect class="bgbox" width="141" height="184" rx="6" transform="translate(1138 691)" />
                            <rect class="bgbox" width="119" height="184" rx="6" transform="translate(967 691)" />
                            <rect class="bgbox" width="141" height="184" rx="6" transform="translate(1138 880)" />
                            <rect class="bgbox" width="119" height="184" rx="6" transform="translate(967 880)" />

                            <g data-name="dots">
                                <circle class="ok" data-name="Ellipse 1445" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(720.101 643.612)" />
                                <circle class="ok" data-name="Ellipse 1445" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(1351.789 643.612)" />
                                <circle class="alert" data-name="Ellipse 1452" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(1612.999 736.612)" />
                                <circle class="ok" data-name="Ellipse 1446" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(1195.999 799.769)" />
                                <circle class="alert" data-name="Ellipse 1450" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(867.001 799.769)" />
                                <circle class="alert" data-name="Ellipse 1451" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(1011.001 799.769)" />
                                <circle class="ok" data-name="Ellipse 1449" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(867 888.223)" />
                                <circle class="ok" data-name="Ellipse 1448" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(1011 888.223)" />
                                <circle class="alert" data-name="Ellipse 1447" cx="11.994" cy="11.994" r="11.994"
                                    transform="translate(1195.999 888.223)" />
                            </g>

                            <g data-name="texts">
                                <text class="description" transform="translate(707 650)">
                                    <tspan x="-114.59" y="0">Flow at bearing </tspan>
                                    <tspan x="-128.058" y="18">lubrication supply</tspan>
                                </text>
                                <text class="description" transform="translate(1387 650)">
                                    <tspan x="0" y="0">Flow at bearing </tspan>
                                    <tspan x="0" y="18">lubrication return</tspan>
                                </text>
                                <text class="description" transform="translate(1625 780)">
                                    <tspan x="-44.912" y="0">Fill reservoir </tspan>
                                    <tspan x="-52.283" y="18">pump running</tspan>
                                </text>
                                <text class="description" transform="translate(1208 844)">
                                    <tspan x="-38.738" y="0">Circulation</tspan>
                                    <tspan x="-56.756" y="18">pump 1 running</tspan>
                                </text>
                                <text class="description" transform="translate(879.001 844)">
                                    <tspan x="-50.19" y="0">Work through</tspan>
                                    <tspan x="-21.427" y="18">filter 1</tspan>
                                </text>
                                <text class="description" transform="translate(1023 844)">
                                    <tspan x="-50.19" y="0">Work through</tspan>
                                    <tspan x="-21.427" y="18">filter 1</tspan>
                                </text>
                                <text class="description" transform="translate(879 929)">
                                    <tspan x="-50.19" y="0">Work through</tspan>
                                    <tspan x="-22.855" y="18">filter 2</tspan>
                                </text>
                                <text class="description" transform="translate(1023.001 929)">
                                    <tspan x="-50.19" y="0">Work through</tspan>
                                    <tspan x="-22.855" y="18">filter 2</tspan>
                                </text>
                                <text class="description" transform="translate(1208 929)">
                                    <tspan x="-38.738" y="0">Circulation</tspan>
                                    <tspan x="-58.184" y="18">pump 2 running</tspan>
                                </text>
                                <text class="description" transform="translate(819 481)">
                                    <tspan x="-95.032" y="0">Water flow at</tspan>
                                    <tspan x="-107.198" y="18">Bearing supply</tspan>
                                </text>

                            </g>

                            <g data-name="lines">
                                <path id="Path_2270" d="M451.851,348.1V333.78H204.2V439.708"
                                    transform="translate(572.676 193.423)" />
                                <path id="Path_2271" d="M204.2,387.65v187.3h21.814V483.18H285"
                                    transform="translate(572.676 289.109)" />
                                <path id="Path_2272" d="M168.824,553.879H110.4v-113"
                                    transform="translate(688.291 423.621)" />
                                <path id="Path_2273" d="M111.013,348.1V333.78H378.136V439.708"
                                    transform="translate(940.594 193.423)" />
                                <path id="Path_2274" d="M286.926,387.864v78.23h74.69v45.133"
                                    transform="translate(1031.052 289.648)" />
                                <path id="Path_2275" d="M339.941,490.227V396.2H441.23"
                                    transform="translate(1164.584 310.647)" />
                                <rect width="174.512" height="183.539" transform="translate(1363.11 771.538)" />
                                <line id="Line_920" x2="173.463" transform="translate(1363.407 815.918)" />
                                <g id="Group_9989" data-name="Group 9989" transform="translate(1375.416 841.046)">
                                    <line id="Line_921" data-name="Line 921" x2="13.946" />
                                    <line id="Line_922" data-name="Line 922" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_923" data-name="Line 923" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_924" data-name="Line 924" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_925" data-name="Line 925" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_926" data-name="Line 926" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9990" data-name="Group 9990" transform="translate(1363.02 826.882)">
                                    <line id="Line_927" data-name="Line 927" x2="13.946" />
                                    <line id="Line_928" data-name="Line 928" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_929" data-name="Line 929" x2="13.946"
                                        transform="translate(161.121 0.065)" />
                                    <line id="Line_930" data-name="Line 930" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_931" data-name="Line 931" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_932" data-name="Line 932" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_933" data-name="Line 933" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9991" data-name="Group 9991" transform="translate(1363.505 855.21)">
                                    <line id="Line_934" data-name="Line 934" x2="13.946" />
                                    <line id="Line_935" data-name="Line 935" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_936" data-name="Line 936" x2="13.946"
                                        transform="translate(161.121 0.065)" />
                                    <line id="Line_937" data-name="Line 937" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_938" data-name="Line 938" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_939" data-name="Line 939" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_940" data-name="Line 940" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9992" data-name="Group 9992" transform="translate(1362.343 883.537)">
                                    <line id="Line_941" data-name="Line 941" x2="13.946" />
                                    <line id="Line_942" data-name="Line 942" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_943" data-name="Line 943" x2="13.946"
                                        transform="translate(161.121 0.065)" />
                                    <line id="Line_944" data-name="Line 944" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_945" data-name="Line 945" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_946" data-name="Line 946" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_947" data-name="Line 947" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9993" data-name="Group 9993" transform="translate(1363.118 911.865)">
                                    <line id="Line_948" data-name="Line 948" x2="13.946" />
                                    <line id="Line_949" data-name="Line 949" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_950" data-name="Line 950" x2="13.946"
                                        transform="translate(161.121 0.065)" />
                                    <line id="Line_951" data-name="Line 951" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_952" data-name="Line 952" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_953" data-name="Line 953" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_954" data-name="Line 954" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9994" data-name="Group 9994" transform="translate(1364.28 940.193)">
                                    <line id="Line_955" data-name="Line 955" x2="13.946" />
                                    <line id="Line_956" data-name="Line 956" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_957" data-name="Line 957" x2="13.946"
                                        transform="translate(161.121 0.065)" />
                                    <line id="Line_958" data-name="Line 958" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_959" data-name="Line 959" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_960" data-name="Line 960" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_961" data-name="Line 961" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9995" data-name="Group 9995" transform="translate(1375.416 869.373)">
                                    <line id="Line_962" data-name="Line 962" x2="13.946" />
                                    <line id="Line_963" data-name="Line 963" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_964" data-name="Line 964" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_965" data-name="Line 965" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_966" data-name="Line 966" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_967" data-name="Line 967" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9996" data-name="Group 9996" transform="translate(1375.416 897.701)">
                                    <line id="Line_968" data-name="Line 968" x2="13.946" />
                                    <line id="Line_969" data-name="Line 969" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_970" data-name="Line 970" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_971" data-name="Line 971" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_972" data-name="Line 972" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_973" data-name="Line 973" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9997" data-name="Group 9997" transform="translate(1375.416 926.029)">
                                    <line id="Line_974" data-name="Line 974" x2="13.946" />
                                    <line id="Line_975" data-name="Line 975" x2="13.946"
                                        transform="translate(53.707 0.065)" />
                                    <line id="Line_976" data-name="Line 976" x2="13.946"
                                        transform="translate(80.561 0.452)" />
                                    <line id="Line_977" data-name="Line 977" x2="13.946"
                                        transform="translate(107.414 0.452)" />
                                    <line id="Line_978" data-name="Line 978" x2="13.946"
                                        transform="translate(134.268 0.065)" />
                                    <line id="Line_979" data-name="Line 979" x2="13.946"
                                        transform="translate(26.854 0.452)" />
                                </g>
                                <g id="Group_9999" data-name="Group 9999" transform="translate(1294.729 632.669)">
                                    <g id="Group_9998" data-name="Group 9998">
                                        <path id="Path_2276" data-name="Path 2276"
                                            d="M313.958,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(-280.319 -375.12)" />
                                        <path id="Path_2277" data-name="Path 2277"
                                            d="M289.879,375.875a22.909,22.909,0,0,1,1.527,39.66"
                                            transform="translate(-256.24 -373.218)" />
                                    </g>
                                    <path id="Path_2278" data-name="Path 2278"
                                        d="M286.14,393.3a65.288,65.288,0,0,0-2.424-17.443"
                                        transform="translate(-271.763 -373.264)" />
                                    <path id="Path_2279" data-name="Path 2279"
                                        d="M283.282,403.031a65.142,65.142,0,0,0,3.952-22.217"
                                        transform="translate(-272.856 -360.778)" />
                                </g>
                                <g id="Group_10001" data-name="Group 10001" transform="translate(755.057 632.669)">
                                    <g id="Group_10000" data-name="Group 10000">
                                        <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(-197.997 -375.12)" />
                                        <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(-173.915 -373.218)" />
                                    </g>
                                    <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(-189.438 -373.264)" />
                                    <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(-190.531 -360.778)" />
                                </g>
                                <g id="Group_10020" data-name="Group 10020" transform="translate(-20 25)">
                                    <path id="Path_2284" data-name="Path 2284"
                                        d="M240.041,340.157H282l-7.866,36.335h-26.6Z"
                                        transform="translate(798.975 175.959)" />
                                    <g id="Group_10019" data-name="Group 10019" transform="translate(984.314 482.758)">
                                        <path id="Path_2299" data-name="Path 2299" d="M0,53.518V20"
                                            transform="translate(67.813 -20)"  />
                                        <path id="Path_2300" data-name="Path 2300" d="M0,53.518V20"
                                            transform="translate(81.236 -20)"  />
                                        <line id="Line_982" data-name="Line 982" y2="6.743"
                                            transform="translate(67.813 69.853)" />
                                        <line id="Line_983" data-name="Line 983" y2="7.492"
                                            transform="translate(81.236 69.478)" />
                                        <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(-220.521 -279.473)" />
                                        <line id="Line_984" data-name="Line 984" x2="68.175"
                                            transform="translate(40.843 129.038)" />
                                        <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(-155.706 -268.872)" />
                                        <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(-193.53 -272.968)" />
                                    </g>
                                </g>
                                <path id="Path_2297" data-name="Path 2297" d="M157.034,0H-126.921"
                                    transform="translate(1028.542 772.301)"  />
                                <path id="Path_2288" data-name="Path 2288" d="M227.193,412.3h69.634V618.239H227.193"
                                    transform="translate(1003.864 359.698)" />
                                <path id="Path_2298" data-name="Path 2298" d="M151.564,0H0"
                                    transform="translate(1034.5 977.5)"  />
                                <line id="Line_987" data-name="Line 987" x1="111" transform="translate(900.5 977.5)" />
                                <line id="Line_988" data-name="Line 988" y1="205" x2="2"
                                    transform="translate(1112.5 772.5)" />
                                <line id="Line_989" data-name="Line 989" x1="61.616"
                                    transform="translate(1300.993 864.059)" fill="#fff" stroke="#fff" />
                                <path id="Path_2301" data-name="Path 2301" d="M10,0H78.906"
                                    transform="translate(1637.008 705.838)"  />
                                <path id="Path_2289" data-name="Path 2289"
                                    d="M376.806,396.048h19.718V617.113l-9.407,23.518"
                                    transform="translate(1383.462 310.261)" />
                                <line id="Line_994" data-name="Line 994" x1="10.348" y1="21.636"
                                    transform="translate(1779.985 927.373)" />
                                <g id="Group_10004" data-name="Group 10004" transform="translate(1715.915 683.279)">
                                    <rect id="Rectangle_17050" data-name="Rectangle 17050" width="31.909"
                                        height="31.909" transform="translate(22.563 0) rotate(45)" />
                                    <line id="Line_996" data-name="Line 996" y2="45.126" transform="translate(22.563)"
                                        stroke-dasharray="1.5 1" />
                                </g>
                                <g id="Group_10012" data-name="Group 10012" transform="translate(885.572 514.17)">
                                    <line id="Line_1004" data-name="Line 1004" x2="34.336"
                                        transform="translate(0 3.548)" fill="#fff" stroke="#fff" />
                                    <path id="Path_2293" data-name="Path 2293" d="M230.494,330.076v6.7l10.056-2.933Z"
                                        transform="translate(-196.659 -330.076)" stroke="#fff"  />
                                </g>
                                <g id="Group_10013" data-name="Group 10013" transform="translate(1789.831 793.741)">
                                    <line id="Line_1005" data-name="Line 1005" y1="34.336"
                                        transform="translate(3.548 9.555)" fill="#fff" stroke="#fff" />
                                    <path id="Path_2294" data-name="Path 2294" d="M389.193,430.951h6.7L392.964,420.9Z"
                                        transform="translate(-389.193 -420.895)" stroke="#fff"  />
                                </g>
                                <g id="Group_10014" data-name="Group 10014" transform="translate(1316.494 848.182)">
                                    <line id="Line_1006" data-name="Line 1006" x1="22.478"
                                        transform="translate(9.555 3.156)" fill="#fff" stroke="#fff" />
                                    <path id="Path_2295" data-name="Path 2295" d="M296.56,443.071v-6.7L286.5,439.3Z"
                                        transform="translate(-286.504 -436.367)" stroke="#fff"  />
                                </g>
                                <g id="Group_10015" data-name="Group 10015" transform="translate(1170.646 514.17)">
                                    <line id="Line_1007" data-name="Line 1007" x2="34.336"
                                        transform="translate(0 3.548)" fill="#fff" stroke="#fff" />
                                    <path id="Path_2296" data-name="Path 2296" d="M274.849,330.076v6.7l10.056-2.933Z"
                                        transform="translate(-241.014 -330.076)" stroke="#fff"  />
                                </g>
                                <g id="Group_10027" data-name="Group 10027" transform="translate(146.359 -15)">
                                    <g id="Group_10006" data-name="Group 10006" transform="translate(1455.641 699.499)">
                                        <circle class="bigcircle" id="Ellipse_1439" data-name="Ellipse 1439" cx="22.479"
                                            cy="22.479" r="22.479" />
                                        <path id="Path_2291" data-name="Path 2291"
                                            d="M345.942,401.056l8.937-6.731v11.288Z"
                                            transform="translate(-345.942 -378.577)" fill="#fff" />
                                    </g>
                                    <g id="Group_10008" data-name="Group 10008" transform="translate(1455.641 645.058)">
                                        <circle class="bigcircle" id="Ellipse_1441" data-name="Ellipse 1441" cx="22.479"
                                            cy="22.479" r="22.479" />
                                    </g>
                                    <line id="Line_997" data-name="Line 997" y2="9.483"
                                        transform="translate(1478.119 690.016)" />
                                    <text class="bigtext" id="M" transform="translate(1466.999 676)">
                                        <tspan x="0" y="0">M</tspan>
                                    </text>
                                </g>
                                <g id="Group_10028" data-name="Group 10028" transform="translate(50.139 -15)">
                                    <g id="Group_10005" data-name="Group 10005" transform="translate(1135.862 765.765)">
                                        <circle class="bigcircle" id="Ellipse_1438" data-name="Ellipse 1438" cx="22.479"
                                            cy="22.479" r="22.479" />
                                        <path id="Path_2290" data-name="Path 2290"
                                            d="M263.59,419.888l8.937-6.731v11.288Z"
                                            transform="translate(-263.59 -397.409)" fill="#fff" />
                                    </g>
                                    <g id="Group_10009" data-name="Group 10009" transform="translate(1135.862 711.6)">
                                        <circle class="bigcircle" id="Ellipse_1442" data-name="Ellipse 1442" cx="22.479"
                                            cy="22.479" r="22.479" />
                                    </g>
                                    <line id="Line_1001" data-name="Line 1001" y2="9.208"
                                        transform="translate(1158.341 756.557)" />
                                    <text class="bigtext" id="M-2" data-name="M" transform="translate(1146.999 743)">
                                        <tspan x="0" y="0">M</tspan>
                                    </text>
                                </g>
                                <g id="Group_10003" data-name="Group 10003" transform="translate(856.999 749.546)">
                                    <rect id="Rectangle_17049" data-name="Rectangle 17049" width="31.909"
                                        height="31.909" transform="translate(22.563 0) rotate(45)" />
                                    <line id="Line_995" data-name="Line 995" y2="45.126" transform="translate(22.563 0)"
                                        stroke-dasharray="1.5 1" />
                                </g>
                                <g id="Group_10002" data-name="Group 10002" transform="translate(1010.001 723.711)">
                                    <rect id="Rectangle_17047" data-name="Rectangle 17047" width="24.929" height="53.15"
                                        transform="translate(0 8.937)" />
                                    <line id="Line_990" data-name="Line 990" x2="24.458"
                                        transform="translate(0 34.336)" />
                                    <line id="Line_991" data-name="Line 991" x2="5.731"
                                        transform="translate(0.383 22.124)" />
                                    <line id="Line_992" data-name="Line 992" x2="5.731"
                                        transform="translate(19.319 22.106)" />
                                    <rect id="Rectangle_17048" data-name="Rectangle 17048" width="8.937" height="8.937"
                                        transform="translate(8.466)" fill="#fff" />
                                </g>
                                <g id="Group_10017" data-name="Group 10017" transform="translate(856 955)">
                                    <rect id="Rectangle_17049-2" data-name="Rectangle 17049" width="31.909"
                                        height="31.909" transform="translate(22.563 0) rotate(45)" />
                                    <line id="Line_995-2" data-name="Line 995" y2="45.126"
                                        transform="translate(22.563 0)" stroke-dasharray="1.5 1" />
                                </g>
                                <g id="Group_10023" data-name="Group 10023" transform="translate(-56.942 6)">
                                    <g id="Group_10011" data-name="Group 10011" transform="translate(1067.921 948.936)">
                                        <rect id="Rectangle_17051" data-name="Rectangle 17051" width="24.929"
                                            height="53.15" transform="translate(0 8.937)" />
                                        <line id="Line_998" data-name="Line 998" x2="24.458"
                                            transform="translate(0 34.336)" />
                                        <line id="Line_999" data-name="Line 999" x2="5.731"
                                            transform="translate(0.383 22.581)" />
                                        <line id="Line_1000" data-name="Line 1000" x2="5.731"
                                            transform="translate(19.319 22.564)" />
                                        <rect id="Rectangle_17052" data-name="Rectangle 17052" width="8.937"
                                            height="8.937" transform="translate(8.466)" fill="#fff" />
                                    </g>
                                    <line id="Line_1003" data-name="Line 1003" x2="24.929"
                                        transform="translate(1066.943 997.404)" />
                                </g>
                                <g id="Group_10024" data-name="Group 10024" transform="translate(50.136 -15)">
                                    <g id="Group_10007" data-name="Group 10007" transform="translate(1135.862 969.255)">
                                        <circle class="bigcircle" id="Ellipse_1440" data-name="Ellipse 1440" cx="22.479"
                                            cy="22.479" r="22.479" />
                                        <path id="Path_2292" data-name="Path 2292"
                                            d="M263.59,472.034l8.937-6.731v11.288Z"
                                            transform="translate(-263.59 -449.555)" fill="#fff" />
                                    </g>
                                    <g id="Group_10010" data-name="Group 10010"
                                        transform="translate(1135.862 1021.781)">
                                        <circle class="bigcircle" id="Ellipse_1443" data-name="Ellipse 1443" cx="22.479"
                                            cy="22.479" r="22.479" />
                                    </g>
                                    <line id="Line_1002" data-name="Line 1002" y2="7.568"
                                        transform="translate(1158.341 1014.213)" />
                                    <text class="bigtext" id="M-3" data-name="M" transform="translate(1146.999 1052)">
                                        <tspan x="0" y="0">M</tspan>
                                    </text>
                                </g>
                            </g>
                            <g id="Group_10032" data-name="Group 10032" transform="translate(-708 20)">
                                <rect class="barbg" width="150" height="24" transform="translate(1545 452)"
                                    fill="#4d4d4d">
                                    <rect class="bar" width="50" height="24" fill="#2d98da" />
                                </rect>
                                <g width="150">
                                    <rect class="barvalue" width="75" height="24" transform="translate(1545 452)"
                                        fill="#2d98da" />-->
                                    <!-- width needs to be calculated to match 100% = 150 width -->
                               <!-- </g>
                                <text class="description" transform="translate(1630 469)">
                                    <tspan x="-26.32" y="0">14.2 l/m</tspan>
                                </text>
                            </g>
                        </g>
                    </svg> -->


                    <svg xmlns="http://www.w3.org/2000/svg" width="1286.981" height="492" viewBox="0 0 1286.981 492" class="waterflowsvg">
                        <g id="Group_10938" data-name="Group 10938" transform="translate(-528.519 -548)">
                          <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"  />
                          <path id="Path_2273" data-name="Path 2273" d="M448.136,392.78v178.2" transform="translate(940.594 178.423)" fill="none" stroke="#fff"  />
                          <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"  />
                          <rect id="Rectangle_17045" data-name="Rectangle 17045" width="174.512" height="183.539" transform="translate(1363.109 719.538)" fill="none" stroke="#fff"  />
                          <line id="Line_920" data-name="Line 920" x2="173.463" transform="translate(1363.406 763.918)" fill="none" stroke="#fff"  />
                          <line id="Line_921" data-name="Line 921" x2="13.946" transform="translate(1375.416 789.046)" fill="none" stroke="#fff"  />
                          <line id="Line_922" data-name="Line 922" x2="13.946" transform="translate(1429.123 789.11)" fill="none" stroke="#fff"  />
                          <line id="Line_923" data-name="Line 923" x2="13.946" transform="translate(1455.977 789.498)" fill="none" stroke="#fff"  />
                          <line id="Line_924" data-name="Line 924" x2="13.946" transform="translate(1482.83 789.498)" fill="none" stroke="#fff"  />
                          <line id="Line_925" data-name="Line 925" x2="13.946" transform="translate(1509.684 789.11)" fill="none" stroke="#fff"  />
                          <line id="Line_926" data-name="Line 926" x2="13.946" transform="translate(1402.27 789.498)" fill="none" stroke="#fff"  />
                          <line id="Line_927" data-name="Line 927" x2="13.946" transform="translate(1363.02 774.882)" fill="none" stroke="#fff"  />
                          <line id="Line_928" data-name="Line 928" x2="13.946" transform="translate(1416.727 774.946)" fill="none" stroke="#fff"  />
                          <line id="Line_929" data-name="Line 929" x2="13.946" transform="translate(1524.141 774.946)" fill="none" stroke="#fff"  />
                          <line id="Line_930" data-name="Line 930" x2="13.946" transform="translate(1443.58 775.334)" fill="none" stroke="#fff"  />
                          <line id="Line_931" data-name="Line 931" x2="13.946" transform="translate(1470.434 775.334)" fill="none" stroke="#fff"  />
                          <line id="Line_932" data-name="Line 932" x2="13.946" transform="translate(1497.287 774.946)" fill="none" stroke="#fff"  />
                          <line id="Line_933" data-name="Line 933" x2="13.946" transform="translate(1389.873 775.334)" fill="none" stroke="#fff"  />
                          <line id="Line_934" data-name="Line 934" x2="13.946" transform="translate(1363.504 803.209)" fill="none" stroke="#fff"  />
                          <line id="Line_935" data-name="Line 935" x2="13.946" transform="translate(1417.211 803.274)" fill="none" stroke="#fff"  />
                          <line id="Line_936" data-name="Line 936" x2="13.946" transform="translate(1524.625 803.274)" fill="none" stroke="#fff"  />
                          <line id="Line_937" data-name="Line 937" x2="13.946" transform="translate(1444.064 803.662)" fill="none" stroke="#fff"  />
                          <line id="Line_938" data-name="Line 938" x2="13.946" transform="translate(1470.918 803.662)" fill="none" stroke="#fff"  />
                          <line id="Line_939" data-name="Line 939" x2="13.946" transform="translate(1497.771 803.274)" fill="none" stroke="#fff"  />
                          <line id="Line_940" data-name="Line 940" x2="13.946" transform="translate(1390.357 803.662)" fill="none" stroke="#fff"  />
                          <line id="Line_941" data-name="Line 941" x2="13.946" transform="translate(1362.344 831.537)" fill="none" stroke="#fff"  />
                          <line id="Line_942" data-name="Line 942" x2="13.946" transform="translate(1416.051 831.602)" fill="none" stroke="#fff"  />
                          <line id="Line_943" data-name="Line 943" x2="13.946" transform="translate(1523.465 831.602)" fill="none" stroke="#fff"  />
                          <line id="Line_944" data-name="Line 944" x2="13.946" transform="translate(1442.904 831.989)" fill="none" stroke="#fff"  />
                          <line id="Line_945" data-name="Line 945" x2="13.946" transform="translate(1469.758 831.989)" fill="none" stroke="#fff"  />
                          <line id="Line_946" data-name="Line 946" x2="13.946" transform="translate(1496.611 831.602)" fill="none" stroke="#fff"  />
                          <line id="Line_947" data-name="Line 947" x2="13.946" transform="translate(1389.197 831.989)" fill="none" stroke="#fff"  />
                          <line id="Line_948" data-name="Line 948" x2="13.946" transform="translate(1363.117 859.865)" fill="none" stroke="#fff"  />
                          <line id="Line_949" data-name="Line 949" x2="13.946" transform="translate(1416.824 859.929)" fill="none" stroke="#fff"  />
                          <line id="Line_950" data-name="Line 950" x2="13.946" transform="translate(1524.238 859.929)" fill="none" stroke="#fff"  />
                          <line id="Line_951" data-name="Line 951" x2="13.946" transform="translate(1443.678 860.317)" fill="none" stroke="#fff"  />
                          <line id="Line_952" data-name="Line 952" x2="13.946" transform="translate(1470.531 860.317)" fill="none" stroke="#fff"  />
                          <line id="Line_953" data-name="Line 953" x2="13.946" transform="translate(1497.385 859.929)" fill="none" stroke="#fff"  />
                          <line id="Line_954" data-name="Line 954" x2="13.946" transform="translate(1389.971 860.317)" fill="none" stroke="#fff"  />
                          <line id="Line_955" data-name="Line 955" x2="13.946" transform="translate(1364.279 888.192)" fill="none" stroke="#fff"  />
                          <line id="Line_956" data-name="Line 956" x2="13.946" transform="translate(1417.986 888.257)" fill="none" stroke="#fff"  />
                          <line id="Line_957" data-name="Line 957" x2="13.946" transform="translate(1525.4 888.257)" fill="none" stroke="#fff"  />
                          <line id="Line_958" data-name="Line 958" x2="13.946" transform="translate(1444.84 888.645)" fill="none" stroke="#fff"  />
                          <line id="Line_959" data-name="Line 959" x2="13.946" transform="translate(1471.693 888.645)" fill="none" stroke="#fff"  />
                          <line id="Line_960" data-name="Line 960" x2="13.946" transform="translate(1498.547 888.257)" fill="none" stroke="#fff"  />
                          <line id="Line_961" data-name="Line 961" x2="13.946" transform="translate(1391.133 888.645)" fill="none" stroke="#fff"  />
                          <line id="Line_962" data-name="Line 962" x2="13.946" transform="translate(1375.416 817.374)" fill="none" stroke="#fff"  />
                          <line id="Line_963" data-name="Line 963" x2="13.946" transform="translate(1429.123 817.438)" fill="none" stroke="#fff"  />
                          <line id="Line_964" data-name="Line 964" x2="13.946" transform="translate(1455.977 817.826)" fill="none" stroke="#fff"  />
                          <line id="Line_965" data-name="Line 965" x2="13.946" transform="translate(1482.83 817.826)" fill="none" stroke="#fff"  />
                          <line id="Line_966" data-name="Line 966" x2="13.946" transform="translate(1509.684 817.438)" fill="none" stroke="#fff"  />
                          <line id="Line_967" data-name="Line 967" x2="13.946" transform="translate(1402.27 817.826)" fill="none" stroke="#fff"  />
                          <line id="Line_968" data-name="Line 968" x2="13.946" transform="translate(1375.416 845.701)" fill="none" stroke="#fff"  />
                          <line id="Line_969" data-name="Line 969" x2="13.946" transform="translate(1429.123 845.766)" fill="none" stroke="#fff"  />
                          <line id="Line_970" data-name="Line 970" x2="13.946" transform="translate(1455.977 846.153)" fill="none" stroke="#fff"  />
                          <line id="Line_971" data-name="Line 971" x2="13.946" transform="translate(1482.83 846.153)" fill="none" stroke="#fff"  />
                          <line id="Line_972" data-name="Line 972" x2="13.946" transform="translate(1509.684 845.766)" fill="none" stroke="#fff"  />
                          <line id="Line_973" data-name="Line 973" x2="13.946" transform="translate(1402.27 846.153)" fill="none" stroke="#fff"  />
                          <line id="Line_974" data-name="Line 974" x2="13.946" transform="translate(1375.416 874.029)" fill="none" stroke="#fff"  />
                          <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"/>
                          </g>
                          <line id="Line_975" data-name="Line 975" x2="13.946" transform="translate(1429.123 874.093)" fill="none" stroke="#fff"  />
                          <line id="Line_976" data-name="Line 976" x2="13.946" transform="translate(1455.977 874.481)" fill="none" stroke="#fff"  />
                          <line id="Line_977" data-name="Line 977" x2="13.946" transform="translate(1482.83 874.481)" fill="none" stroke="#fff"  />
                          <line id="Line_978" data-name="Line 978" x2="13.946" transform="translate(1509.684 874.093)" fill="none" stroke="#fff"  />
                          <line id="Line_979" data-name="Line 979" x2="13.946" transform="translate(1402.27 874.481)" fill="none" stroke="#fff"  />
                          <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"  />
                          <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"  />
                          <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"  />
                          <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.136) rotate(90)" fill="none" stroke="#fff"  />
                          <path id="Path_2284" data-name="Path 2284" d="M240.041,340.157H282l-7.866,36.335h-26.6Z" transform="translate(361.975 532.958)" fill="none" stroke="#fff"  />
                          <path id="Path_2299" data-name="Path 2299" d="M0,123.182V20" transform="translate(616.127 750.094)" fill="none" stroke="#fff" />
                          <path id="Path_2300" data-name="Path 2300" d="M0,123.182V20" transform="translate(629.551 750.094)" fill="none" stroke="#fff" />
                          <line id="Line_982" data-name="Line 982" y2="6.743" transform="translate(616.127 909.611)" fill="none" stroke="#fff"  />
                          <line id="Line_983" data-name="Line 983" y2="7.492" transform="translate(629.551 909.237)" fill="none" stroke="#fff"  />
                          <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"  />
                          <line id="Line_984" data-name="Line 984" x2="68.175" transform="translate(588.156 968.796)" fill="none" stroke="#fff"  />
                          <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"  />
                          <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"  />
                          <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"  />
                          <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"  />
                          <line id="Line_990" data-name="Line 990" x2="24.458" transform="translate(899.051 707.462) rotate(180)" fill="none" stroke="#fff"  />
                          <line id="Line_991" data-name="Line 991" x2="5.731" transform="translate(898.668 719.674) rotate(180)" fill="none" stroke="#fff"  />
                          <line id="Line_992" data-name="Line 992" x2="5.731" transform="translate(879.732 719.691) rotate(180)" fill="none" stroke="#fff"  />
                          <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"  />
                          <line id="Line_988" data-name="Line 988" y1="231" transform="translate(1114.5 720.5)" fill="none" stroke="#fff"  />
                          <line id="Line_989" data-name="Line 989" x1="32.508" transform="translate(1300.992 812.059)" fill="#fff" stroke="#fff"  />
                          <path id="Path_2301" data-name="Path 2301" d="M10,0H149.529" transform="translate(1590.461 717.539) rotate(-90)" fill="none" stroke="#fff" />
                          <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"  />
                          <line id="Line_994" data-name="Line 994" x1="8.514" y1="13.126" transform="translate(1590.986 1009.374)" fill="none" stroke="#fff"  />
                          <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"  />
                          <line id="Line_996" data-name="Line 996" y2="45.126" transform="translate(1613.041 792.842) rotate(90)" fill="none" stroke="#fff"   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"  />
                          <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" />
                          <line id="Line_1006" data-name="Line 1006" x1="22.478" transform="translate(1353.049 939.338)" fill="#fff" stroke="#fff"  />
                          <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" />
                          <line id="Line_1007" data-name="Line 1007" x2="34.336" transform="translate(1092.646 556.718)" fill="#fff" stroke="#fff"  />
                          <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" />
                          <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"  />
                          <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"  />
                          <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"  />
                          <line id="Line_995" data-name="Line 995" y2="45.126" transform="translate(1024.563 697.546)" fill="none" stroke="#fff"   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"  />
                          <line id="Line_995-2" data-name="Line 995" y2="45.126" transform="translate(1023.563 929)" fill="none" stroke="#fff"   stroke-dasharray="1.5 1"/>
                          <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>
               




                          <rect id="Rectangle_17051" data-name="Rectangle 17051" width="24.929" height="53.15" transform="translate(872.979 911.873)" fill="none" stroke="#fff"  />
                          <line id="Line_998" data-name="Line 998" x2="24.458" transform="translate(872.979 937.272)" fill="none" stroke="#fff"  />
                          <line id="Line_999" data-name="Line 999" x2="5.731" transform="translate(873.361 925.518)" fill="none" stroke="#fff"  />
                          <line id="Line_1000" data-name="Line 1000" x2="5.731" transform="translate(892.297 925.5)" fill="none" stroke="#fff"  />
                          <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"  />
                          <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"  />
                          <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"  />
                          <path id="Path_2778" data-name="Path 2778" d="M0,123.182V71.643" transform="translate(616.127 611.094)" fill="none" stroke="#fff" />
                          <path id="Path_2779" data-name="Path 2779" d="M0,123.182V71" transform="translate(629.549 611.094)" fill="none" stroke="#fff" />
                          <path id="Path_2780" data-name="Path 2780" d="M253.851,333.78H204.2v14.928" transform="translate(432.676 385.423)" fill="none" stroke="#fff"  />
                          <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"  />
                          <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"  />
                          <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"  />
                          <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.136) rotate(90)" fill="none" stroke="#fff"  />
                          <path id="Path_2781" data-name="Path 2781" d="M20952.932,7707.606h18.926v122.527h-18.926" transform="translate(-20221 -6988)" fill="none" stroke="#fff" />
                          <path id="Path_2782" data-name="Path 2782" d="M20907.057,7828.059h-47.879v29.821" transform="translate(-20221 -6985)" fill="none" stroke="#fff" />
                          <path id="Path_2297" data-name="Path 2297" d="M11.523,0H-126.921" transform="translate(1174.055 720.301)" fill="none" stroke="#fff" />
                          <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" />
                          <path id="Path_2784" data-name="Path 2784" d="M10,0H37.043" transform="translate(1590.461 780.279) rotate(-90)" fill="none" stroke="#fff" />
                          <line id="Line_1005-2" data-name="Line 1005" y1="34.336" transform="translate(1535.793 556.49) rotate(-90)" fill="#fff" stroke="#fff"  />
                          <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" />
                          <g id="Rectangle_17320" data-name="Rectangle 17320" transform="translate(577 623)" fill="none" stroke="#fff" >
                            <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.463v30.184" transform="translate(-20221 -6988)" fill="none" stroke="#fff" />
                          <path id="Path_2786" data-name="Path 2786" d="M20794.34,7798.059h-26.953" transform="translate(-20221 -7016)" fill="none" stroke="#fff" />
                          <path id="Path_2271" data-name="Path 2271" d="M178.2,544.95h47.814V483.18H307" transform="translate(572.676 237.109)" fill="none" stroke="#fff"  />
                          <path id="Path_2787" data-name="Path 2787" d="M21113.871,7736.29h110.012" transform="translate(-20221 -7016)" fill="none" stroke="#fff" />
                          <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"  />
                          <line id="Line_987" data-name="Line 987" x1="126" transform="translate(876.5 951.5)" fill="none" stroke="#fff"  />
                          <path id="Path_2298" data-name="Path 2298" d="M139.936,0H0" transform="translate(1046.129 951.5)" fill="none" stroke="#fff" />
                          <line id="Line_1007-2" data-name="Line 1007" x2="34.336" transform="translate(532.787 690.467) rotate(-90)" fill="#fff" stroke="#fff"  />
                          <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" />
                          <g id="Ellipse_1477" data-name="Ellipse 1477" transform="translate(877 548) rotate(90)" fill="#none" class="bigcircle">
                            <circle cx="23.5" cy="23.5" r="23.5" stroke="none"/>
                            <circle cx="23.5" cy="23.5" r="23" fill="none"/>
                          </g>
                          <circle id="Ellipse_1478-2" class="dot" data-name="Ellipse 1478" cx="1.5" cy="1.5" r="1.5" transform="translate(855 561.5) rotate(180)" fill="#fff"/>
                          <circle id="Ellipse_1478" class="dot" data-name="Ellipse 1478" cx="1.5" cy="1.5" r="1.5" transform="translate(852 582)" fill="#fff"/>

                          <path id="Path_2790" data-name="Path 2790" d="M0,0H45.607" transform="translate(830.482 567.5)" fill="none" stroke="#fff" />
                          <line id="Line_1105" data-name="Line 1105" x2="46" transform="translate(830.5 575.5)" fill="none" stroke="#fff" />
                          <line id="Line_1106" data-name="Line 1106" y1="11" transform="translate(853.5 583.5)" fill="none" stroke="#fff" />
                          <path id="Path_2788" data-name="Path 2788" d="M0,11.326V0" transform="translate(853.5 560) rotate(180)" fill="none" stroke="#fff" />
                          <path id="Path_2789" data-name="Path 2789" d="M.066,20.416,9.705-2.847" transform="translate(853.5 580.5) rotate(180)" fill="none" stroke="#fff" />


                          <g id="Group_10936" data-name="Group 10936">
                            <text id="Fill_reservoir_pump_running"  transform="translate(1736 732)" class="description"><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"   transform="translate(1208 792)" class="description"><tspan x="-36.756" y="0">Circulation</tspan><tspan x="-56.756" y="18">pump 1 running</tspan></text>
                            <text id="Circulation_pump_2_running"   transform="translate(1208 877)" class="description"><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"        transform="translate(885 792)" class="description"><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"      transform="translate(1024 792)" class="description"><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"        transform="translate(1024 877)" class="description"><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"      transform="translate(885 877)" class="description"><tspan x="-50.19" y="0">Work through</tspan><tspan x="-22.855" y="18">filter 2</tspan></text>
                          </g>
                          <text id="M" class="bigtext"      transform="translate(1633.236 729.638)"><tspan x="0" y="0">M</tspan></text>
                          <text id="M-2" class="bigtext"    transform="translate(1197.139 676)"><tspan x="0" y="0">M</tspan></text>
                          <text id="M-3" class="bigtext"    transform="translate(1197.137 1011)"><tspan x="0" y="0">M</tspan></text>

                        </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>