<div id="tablewrapper">

    <!-- @import "/app/loader/components/loader.html" -->

    <div class="hiddenwhileloading" style="display:none;">

        <table class="itemtable" id="Denmark">
            <thead>
                <tr>
                    <th id="titletd">
                        <div class="material-input">

                            <input class="unitsearch" required>

                            <label>Parks</label>
                            <i class="icon icon-search"></i>
                            <error>You cant do that</error>

                        </div>
                        <div class="sort-arrows">
                            <div class="arrow-up active"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>
                    <th id="actiontd" class="noinput">Action</th>
                    <th>

                        <div class="material-input">

                            <input required>

                            <label>Power</label>
                            <i class="icon icon-filter disabled"></i>

                        </div>
                        <div class="sort-arrows">
                            <div class="arrow-up"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>
                    <th>


                        <div class="material-input">

                            <input required>

                            <label>Wind speed</label>
                            <i class="icon icon-filter disabled"></i>

                        </div>
                        <div class="sort-arrows">
                            <div class="arrow-up"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>
                    <th>

                        <div class="material-input">

                            <input required>

                            <label>Wind Direction</label>
                            <i class="icon icon-filter disabled"></i>
                        </div>
                        <div class="sort-arrows">
                            <div class="arrow-up"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>
                    <th class="noinput text-center">Status</th>



                    <th>

                        <div class="material-input">

                            <input required>

                            <label>Energy Factor</label>
                            <i class="icon icon-filter disabled"></i>

                        </div>
                        <div class="sort-arrows">
                            <div class="arrow-up"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>
                    <th>

                        <div class="material-input">

                            <input required>

                            <label>Budget</label>
                            <i class="icon icon-filter disabled"></i>

                        </div>

                        <div class="sort-arrows">
                            <div class="arrow-up"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>
                    <th>
                        <div class="material-input">

                            <input required>

                            <label>Availability</label>
                            <i class="icon icon-filter disabled"></i>

                        </div>

                        <div class="sort-arrows">
                            <div class="arrow-up"></div>
                            <div class="arrow-down"></div>
                        </div>
                    </th>

                </tr>
            </thead>
            <tbody>
                <tr class="location">
                    <td>

                        <h1>Denmark</h1>
                    </td>
                    <td class="text-right">
                        <h1>
                            <i class="icon icon-stop"></i>
                            <i class="icon icon-start" style="margin-right:7px;"></i>
                        </h1>
                    </td>
                    <td colspan="99"></td>
                </tr>


                <tr class="datarow">

                    <td>
                        <i class="uniticon icon icon-turbine"></i>
                        <a href="#">KK Park</a>
                    </td>
                    <td>

                        <i class="icon icon-reports detailbtn" data-toggle="tooltip" data-original-title="Reports"></i>
                        <i class="icon icon-predictor detailbtn" data-toggle="tooltip"
                            data-original-title="Predictor"></i>
                        <i class="icon icon-singleline detailbtn" data-toggle="tooltip"
                            data-original-title="Single Line Diagram"></i>
                        <i class="icon icon-lightning detailbtn" data-toggle="tooltip"
                            data-original-title="Meteorology Stations"></i>
                        <i class="icon icon-dots dropdown-toggle dropright drill-drop" data-toggle="dropdown"
                            aria-haspopup="true" aria-expanded="false">


                            <div class="dropdown-menu">
                                    <i class="icon icon-close hidden" id="parkclose"></i>
                                <p class="drillmenuheader">TB01 </p>
                                <div class="defaultdrop">
                                    <i class="icon icon-reports detailbtn"> Reports</i>
                                    <i class="icon icon-predictor detailbtn"> Predictor</i>
                                    <i class="icon icon-singleline detailbtn"> Single Line Diagram</i>
                                    <i class="icon icon-lightning detailbtn"> Meteorology Stations</i>
                                    <i class="icon icon-powercurve detailbtn"> Grid Meters</i>
                                    <i class="icon icon-heatmap detailbtn"> Heat Map</i>
                                    <i class="icon icon-windrose detailbtn"> Foundation Monitor</i>

                                    <div class="dropdownsub">
                                        <i class="icon icon-start">
                                            <span class="disabled">Start Park</span>
                                        </i>
                                        <i class="icon icon-stop parkaction">
                                            <span>Stop Park</span>
                                        </i>
                                    </div>
                                </div>
                                <div class="hidden drop_parkaction">
                                    <i class="icon icon-stop parkaction">
                                        <span>Stop Park</span>
                                    </i>
                                    <hr>
                                    <div class="scrollarea">

                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-770" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-770">
                                                <i class="icon icon-turbine"></i>Select all units</label>
                                        </div>
                                        <hr>

                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-771" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-771">
                                                <i class="icon icon-turbine"></i>TB01</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-772" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-772">
                                                <i class="icon icon-turbine"></i>TB02</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-773" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-773">
                                                <i class="icon icon-turbine"></i>TB03</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-774" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-774">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-775" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-775">
                                                <i class="icon icon-turbine"></i>TB05</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-776" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-776">
                                                <i class="icon icon-turbine"></i>TB06</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-777" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-777">
                                                <i class="icon icon-turbine"></i>TB07</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-778" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-778">
                                                <i class="icon icon-turbine"></i>TB08</label>
                                        </div>
                                        <hr>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-779" type="checkbox"
                                                value="value1">
                                            <label for="styled-checkbox-779">
                                                <i class="icon icon-turbine"></i>TB09</label>
                                        </div>
                                        <hr>
                                    </div>

                                    <p>Delay between stopping units</p>
                                    <div class="material-input"><input /></div> seconds
                                    <hr>
                                    <div class="material-input"><input type="password" placeholder="Password" />
                                    </div><a class="btn confirm">Confirm</a>



                                </div>
                            </div>
                        </i>
                    </td>
                    <td class="bar">
                        <div class="barbg">
                            <div class="bardisplay" style="width:75%;"></div>
                            <div class="barvalue">22,000 kW</div>
                        </div>
                    </td>
                    <td class="bar">
                        <div class="barbg">
                            <div class="bardisplay bg-blue" style="width:15%;"></div>
                            <div class="barvalue">5 m/s</div>
                        </div>

                    </td>
                    <td class="text-center">22&deg;&nbsp;&nbsp;
                        <img src="/app/core/images/winddirection.svg" class="windarrow"
                            style="transform: rotate(305deg)" />
                    </td>
                    <td class="text-center">
                        <ul class="alarmicons cursor-clear">
                            <li>
                                <span class="icon-stack">
                                    <i class="icon-tri_bg"></i>
                                    <i class="icon-alert color-alert"></i>
                                </span>
                                <span class="label-count">5</span>
                            </li>
                            <li>
                                <span class="icon-stack">
                                    <i class="icon-tri_bg"></i>

                                    <i class="icon-warning color-warning" style="font-size:16px;"></i>
                                </span>
                                <span class="label-count">5</span>
                            </li>
                            <li>

                            </li>
                            <li>
                                <i class="icon-radio color-comm" style="font-size:16px;"></i>
                                <span class="label-count">5</span>
                            </li>
                        </ul>
                    </td>

                    <td class="bar">
                        <div class="barbg">
                            <div class="bardisplay bg-neutral" style="width:75%;"></div>
                            <div class="barvalue">75%</div>
                        </div>
                    </td>

                    <td class="bar">
                        <div class="barbg">
                            <div class="bardisplay bg-neutral" style="width:12%;"></div>
                            <div class="barvalue">12%</div>
                        </div>
                    </td>
                    <td class="bar">
                        <div class="barbg">
                            <div class="bardisplay bg-neutral" style="width:50%;"></div>
                            <div class="barvalue">50%</div>
                        </div>
                    </td>
                </tr>





            </tbody>
        </table>
    </div>
</div>
<div class="drillcontainer"  id="foundations">
<div class="row tools">
        <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 class="col-12">
             <!-- @import "/app/unitdetails/components/foundation_park.kit" -->
        </div>
    </div>

</div>