<!-- @import "/kitparts/head.html" -->


<!-- @import "/app/nav/components/nav.html" -->
<div class="container-fluid">
    <!-- @import "/app/settings/components/settings.html" -->
    <div class="row">
        <!-- @import "/app/breadcrumb/components/breadcrumb.html" -->
        <!-- @import "/app/portfolio/components/portfolio.html" -->
    </div>
    <div class="row">
        <div class="col-12">
            <div class="scadacard level1" id="reportwrapper">
                <div class="row contentrow">
                    <div class="col-3 reportsidebar">
                        <h3 style="margin-top:0px;">Global</h3>

                        <div class="checkboxwrapper">
                            <a href="#">
                                <i class="icon icon-plus"></i> Select all parks</a>
                        </div>
                        <div class="checkboxwrapper">
                            <a href="#">
                                <i class="icon icon-plus"></i> Select all units</a>
                        </div>
                        <div class="divider"></div>
                        <br/>
                        <h3>Parks</h3>
                        <ul class="nav nav-list nav-menu-list-style">
                            <li>
                                <div class="checkboxwrapper nav-header">
                                    <input class="styled-checkbox" id="styled-checkbox-700" type="checkbox" value="value1">
                                    <label for="styled-checkbox-700">
                                        <i class="icon icon-turbinepark"></i>18 characters park with more than 18 charactaers</label>
                                    <span class="tree-toggle">
                                        <i class="icon icon-down"></i>
                                    </span>
                                    <span class="selectall">Select all
                                        <i class="icon icon-plus"></i>
                                    </span>

                                </div>
                                <ul class="nav nav-list tree">
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-160" type="checkbox" value="value1">
                                            <label for="styled-checkbox-160">
                                                <i class="icon icon-turbine"></i>18 characters unit wiubr ieuhg iuerh</label>
                                        </div>
                                    </li>
                                    <li class="disabled">
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-161" type="checkbox" value="value1">
                                            <label for="styled-checkbox-161">
                                                <i class="icon icon-turbine"></i>TB02</label>
                                        </div>
                                    </li>
                                    <li class="disabled">
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-162" type="checkbox" value="value1">
                                            <label for="styled-checkbox-162">
                                                <i class="icon icon-turbine"></i>TB03</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-163" type="checkbox" value="value1">
                                            <label for="styled-checkbox-163">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                </ul>
                            </li>

                            <li class="divider"></li>

                            <li>
                                <div class="checkboxwrapper nav-header">
                                    <input class="styled-checkbox" id="styled-checkbox-770" type="checkbox" value="value1">
                                    <label for="styled-checkbox-770">
                                        <i class="icon icon-turbinepark"></i>GE Park</label>
                                    <span class="tree-toggle">
                                        <i class="icon icon-down"></i>
                                    </span>
                                    <span class="selectall">Select all
                                        <i class="icon icon-plus"></i>
                                    </span>
                                </div>
                                <ul class="nav nav-list tree">
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-1600" type="checkbox" value="value1">
                                            <label for="styled-checkbox-1600">
                                                <i class="icon icon-turbine"></i>TB01</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-1601" type="checkbox" value="value1">
                                            <label for="styled-checkbox-1601">
                                                <i class="icon icon-turbine"></i>TB02</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-1602" type="checkbox" value="value1">
                                            <label for="styled-checkbox-1602">
                                                <i class="icon icon-turbine"></i>TB03</label>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="checkboxwrapper">
                                            <input class="styled-checkbox" id="styled-checkbox-1603" type="checkbox" value="value1">
                                            <label for="styled-checkbox-1603">
                                                <i class="icon icon-turbine"></i>TB04</label>
                                        </div>
                                    </li>
                                </ul>
                            </li>

                            <li class="divider"></li>

                        </ul>
                    </div>
                    <div class="col-9 reportcontent">
                        <div class="row" style="padding-bottom:20px;">
                            <div class="col-6">
                                <div class="imageinput dropdown" style="width:250px;">
                                    <input type="text" class="dropdown-toggle" placeholder="Report subscriptions" data-toggle="dropdown" role="button">
                                    <i class="icon icon-down"></i>
                                    <div class="dropdown-menu subscriptions" aria-labelledby="reportDropdown">
                                        <table>
                                            <tr>
                                                <td>My daily report</td>
                                                <td>
                                                    <i class="icon icon-edit"></i>
                                                    <i class="icon icon-minus"></i>

                                                </td>
                                            </tr>
                                            <tr>
                                                <td>My weekly report</td>
                                                <td>
                                                    <i class="icon icon-edit"></i>
                                                    <i class="icon icon-minus"></i>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>My monthly report</td>
                                                <td>
                                                    <i class="icon icon-edit"></i>
                                                    <i class="icon icon-minus"></i>
                                                </td>
                                            </tr>
                                            <tr>
                                                <td>So you decided to go and make an insanely long name for your report did you?</td>
                                                <td>
                                                    <i class="icon icon-edit"></i>
                                                    <i class="icon icon-minus"></i>
                                                </td>
                                            </tr>

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

                                <button class="btn" data-toggle="modal" data-target="#configerrorModal">Create subscription</button>
                            </div>
                            <div class="col-6 text-right">
                                <div class="imageinput dropdown">
                                    <!-- <input type="text" class="dropdown-toggle" placeholder="Select period" data-toggle="dropdown" role="button">
                                            <img role="img" src="/app/core/images/period.svg" />-->
                                    <button class="btn" data-toggle="dropdown" role="button">Generate report</button>

                                    <div class="dropdown-menu" aria-labelledby="reportDropdown" style="margin-left:-100px;">
                                        <div class="row dropdownheader ">
                                            <div class="col">
                                                <table>
                                                    <tr class="reportPeriodOk">
                                                        <td>Today</td>
                                                        <td>May 7</td>
                                                    </tr>
                                                    <tr class="reportPeriodOk">
                                                        <td>Last 7 days</td>
                                                        <td>May 1 - May 7</td>
                                                    </tr>
                                                    <tr class="reportPeriodOk">
                                                        <td>Last 14 days</td>
                                                        <td>April 24 - May 7</td>
                                                    </tr>
                                                    <tr class="reportPeriodOk">
                                                        <td>This month</td>
                                                        <td>May 1 - May 7</td>
                                                    </tr>
                                                    <tr class="reportPeriodOk">
                                                        <td>Last month</td>
                                                        <td>April 7 - May 7</td>
                                                    </tr>
                                                    <tr class="reportPeriodOk">
                                                        <td colspan="2">Custom range</td>
                                                    </tr>
                                                    <!-- <tr>
                                                        <td colspan="2">
                                                            <button class="btn reportPeriodOk" id="reportPeriodOk" data-toggle="dropdown" role="button">OK</button>
                                                        </td>
                                                    </tr>-->
                                                </table>


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



                            </div>

                        </div>
                        <div class="row">
                            <div class="col-12">
                                <ul class="nav nav-tabs" role="tablist">
                                    <li class="nav-item">
                                        <a class="nav-link active" href="#reportsettings" role="tab" data-toggle="tab">Report settings</a>
                                    </li>
                                    <li class="nav-item">
                                        <a class="nav-link" href="#subscriptionsettings" role="tab" data-toggle="tab">Subscription settings</a>
                                    </li>
                                </ul>

                                <p style="position: absolute; right:40px; top:3px;">
                                    <i class="icon icon-details"></i> You are currently editing the subscription “The weekly turbine feedback”</p>

                                <!-- Tab panes -->
                                <div class="tab-content">
                                    <div role="tabpanel" class="tab-pane active" id="reportsettings">
                                        <div class="recipientwrapper">

                                            <div class="row">
                                                <div class="col-12 text-right">
                                                    <button class="btn">Save</button>
                                                    <button class="btn">Close</button>
                                                </div>
                                            </div>


                                            <div class="row reportrow focusrow">
                                                <div class="col-2">
                                                    <p>Report type:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown ">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select report type" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>Report type 2</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Report type 3</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Report type 4</td>
                                                                    </tr>

                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>


                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Format:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select format" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>PDF</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another type</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another type</td>
                                                                    </tr>

                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>


                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Amount:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select amount" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>All</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>

                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Order by:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select order" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>Duration</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Time units:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select time unit" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>Hours</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Days</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Weeks</td>
                                                                    </tr>
                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Mode:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select mode" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>Combined</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Filter by:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select filter type" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>Definition</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>

                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>

                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Severity:</p>
                                                </div>
                                                <div class="col-4">
                                                    <div class="inputwrapper">
                                                        <div class="imageinput dropdown">
                                                            <input type="text" class="dropdown-toggle" placeholder="Select severity" data-toggle="dropdown" role="button">
                                                            <i class="icon icon-down"></i>
                                                            <div class="dropdown-menu" aria-labelledby="reportDropdown">
                                                                <table>
                                                                    <tr>
                                                                        <td>>=25</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>Another</td>
                                                                    </tr>

                                                                </table>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="col-6"></div>


                                            </div>
                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Type:</p>
                                                </div>
                                                <div class="col-10">
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-1" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-1">Undefined</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-2" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-2">Alarm</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-3" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-3">Warning</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-4" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-4">Operation</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-5" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-5">System</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-6" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-6">Service</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Reset type:</p>
                                                </div>
                                                <div class="col-10">
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-7" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-7">Undefined</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-8" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-8">Auto Reset</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-9" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-9">Manual Reset</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-10" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-10">Remote Reset</label>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="row reportrow">
                                                <div class="col-2">
                                                    <p>Event Category:</p>
                                                </div>
                                                <div class="col-10">
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-11" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-11">Unit</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-12" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-12">Ticket</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-13" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-13">One View</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-14" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-14">Virtual</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-15" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-15">Predictor</label>
                                                    </div>
                                                    <div class="checkboxwrapper">
                                                        <input class="styled-checkbox" id="styled-checkbox-16" type="checkbox" value="value1">
                                                        <label for="styled-checkbox-16">Reset Point</label>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="row reportrow ">
                                                <div class="col-12 noborderbottom text-right">
                                                    <button class="btn">Save</button>
                                                    <button class="btn">Close</button>
                                                </div>
                                            </div>

                                        </div>
                                    </div>
                                    <div role="tabpanel" class="tab-pane" id="subscriptionsettings">
                                        <div class="recipientwrapper">

                                            <div class="row">
                                                <div class="col-4">
                                                    <p>Name your subscription:</p>
                                                    <input type="text" placeholder="The weekly turbine feedback">
                                                    <br>
                                                    <br>
                                                    <p>Send report as email: </p>
                                                    <div class="checkboxinline">
                                                        <div class="checkboxwrapper">
                                                            <input class="styled-checkbox" id="styled-checkbox-189" type="checkbox" value="value1">
                                                            <label for="styled-checkbox-189">Daily</label>
                                                        </div>
                                                        <div class="checkboxwrapper">
                                                            <input class="styled-checkbox" id="styled-checkbox-190" type="checkbox" value="value1">
                                                            <label for="styled-checkbox-190">Weekly</label>
                                                        </div>
                                                        <div class="checkboxwrapper">
                                                            <input class="styled-checkbox" id="styled-checkbox-191" type="checkbox" value="value1">
                                                            <label for="styled-checkbox-191">Monthly</label>
                                                        </div>
                                                    </div>
                                                    <br>
                                                    <button class="btn">Save</buttton>
                                                        <button class="btn">Close</button>

                                                </div>

                                                <div class="col-4">


                                                    <p class="recipientheader">Choose emailrecipients:</p>
                                                    <div class="imageinput recipients">
                                                        <input type="text" placeholder="Find recipient">
                                                        <img role="img" src="/app/core/images/search.svg" />
                                                    </div>

                                                    <ul class="chooserecipients">
                                                        <li>Norris Neuhaus
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Leonarda Chagnon
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Lauren Mobley
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Eveline Schecter
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Jose Heitman
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Liza London
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Alicia Orso
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Dot Yarborough
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Randee Portier
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Stephnie Swart
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Norris Neuhaus
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Leonarda Chagnon
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>
                                                        <li>Lauren Mobley
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span> </li>
                                                        <li>Eveline Schecter
                                                            <span>
                                                                <img src="/app/core/images/add.svg" alt="add recpient">
                                                            </span>
                                                        </li>

                                                    </ul>
                                                </div>
                                                <div class="col-4">
                                                    <p class="recipientheader">Selected recipients:</p>
                                                    <ul class="selectedrecipients">

                                                        <li>Jose Heitman
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li> iza London
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Alicia Orso
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Dot Yarborough
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Randee Portier
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Stephnie Swart
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Norris Neuhaus
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Leonarda Chagnon
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Lauren Mobley
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Eveline Schecter
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Jose Heitman
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li> iza London
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Alicia Orso
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Dot Yarborough
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Randee Portier
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                        <li>Stephnie Swart
                                                            <span>
                                                                <img src="/app/core/images/delete.svg" alt="remove recpient">
                                                            </span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


<div class="modal fade" id="reportModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="reportModalLabel">
                    Report loading</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-12 reportloading">
                            <!-- @import "/app/loader/components/loader.html" -->

                        </div>
                        <div class="col-12 reportloadsuccess">
                            Report loaded succcessfully.
                            <br>What action would you like to perform?
                            <br>
                            <br>

                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <div class="col-6">
                    <button class="btn reportloadsuccess" data-dismiss="modal">Cancel</button>

                    <button class="btn reportloading" id="cancelReport" data-dismiss="modal">Cancel report</button>
                </div>
                <div class="col-6 text-right">
                    <button class="btn reportloadsuccess">Show report</button>
                    <button class="btn reportloadsuccess">Save report</button>
                </div>

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





<div class="modal alarmmodal fade" id="configerrorModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
    aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg" style="max-width:1000px;" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="reportModalLabel">
                    <i class="icon icon-alert"></i>
                    Unit Configuration Error</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="container-fluid">


                    <div class="row">
                        <div class="col-4 dark">
                            <table>
                                <tbody>
                                    <tr>
                                        <td>Some of the selected units are not configured correctly for the chosen report type.
                                            <br>
                                            <br> These units will be deselected if you proceed.</td>

                                    </tr>
                                </tbody>
                            </table>

                        </div>


                        <div class="col-8 note">
                            <ul class="configerrorlist" style="height:280px; overflow-y: scroll;">
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>
                                <li>TB03</li>

                            </ul>


                        </div>
                    </div>






                </div>
                <div class="modal-footer">
                    <div class="col-6">
                        <button class="btn" data-dismiss="modal">Cancel</button>
                    </div>
                    <div class="col-6 text-right">

                        <button class="btn" data-dismiss="modal">Accept</button>
                    </div>

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




<!-- @import "/kitparts/end.html" -->