<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- Global site tag (gtag.js) - Google Analytics -->
        <script async src="https://www.googletagmanager.com/gtag/js?id=UA-90680653-2"></script>
        <script>
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            
            gtag('config', 'UA-90680653-2');
        </script>
        <!-- Required meta tags -->
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <!-- Twitter -->
        <!-- <meta name="twitter:site" content="@bootstrapdash">
            <meta name="twitter:creator" content="@bootstrapdash">
            <meta name="twitter:card" content="summary_large_image">
            <meta name="twitter:title" content="Azia">
            <meta name="twitter:description" content="Responsive Bootstrap 4 Dashboard Template">
            <meta name="twitter:image" content="https://www.bootstrapdash.com/azia/img/azia-social.png"> -->
        <!-- Facebook -->
        <!-- <meta property="og:url" content="https://www.bootstrapdash.com/azia">
            <meta property="og:title" content="Azia">
            <meta property="og:description" content="Responsive Bootstrap 4 Dashboard Template">
            
            <meta property="og:image" content="https://www.bootstrapdash.com/azia/img/azia-social.png">
            <meta property="og:image:secure_url" content="https://www.bootstrapdash.com/azia/img/azia-social.png">
            <meta property="og:image:type" content="image/png">
            <meta property="og:image:width" content="1200">
            <meta property="og:image:height" content="600"> --> 
        <!-- Meta -->
        <meta name="description" content="Responsive Bootstrap 4 Dashboard Template">
        <meta name="author" content="BootstrapDash">
        <title>Azia Responsive Bootstrap 4 Dashboard Template</title>
        <!-- vendor css -->
        <link href="{{ asset('assets/lib/fontawesome-free/css/all.min.css') }}" rel="stylesheet">
        <link href="{{ asset('assets/lib/ionicons/css/ionicons.min.css') }}" rel="stylesheet">
        <link href="{{ asset('assets/lib/typicons.font/typicons.css') }}" rel="stylesheet">
        <link href="{{ asset('assets/lib/line-awesome/css/line-awesome.min.css') }}" rel="stylesheet">
        <!-- azia CSS -->
        <link rel="stylesheet" href="{{ asset('assets/css/azia.css') }}">
    </head>
    <body>
        <div class="az-header">
            <div class="container">
                <div class="az-header-left">
                    <a href="{{ path('app_demo_index') }}" class="az-logo"><span></span> azia</a>
                    <a href="" id="azMenuShow" class="az-header-menu-icon d-lg-none"><span></span></a>
                </div>
                <!-- az-header-left -->
                <div class="az-header-menu">
                    <div class="az-header-menu-header">
                        <a href="{{ path('app_demo_index') }}" class="az-logo"><span></span> azia</a>
                        <a href="" class="close">&times;</a>
                    </div>
                    <!-- az-header-menu-header -->
                    <ul class="nav">
                        <li class="nav-item">
                            <a href="{{ path('app_demo_index') }}" class="nav-link"><i class="typcn typcn-chart-area-outline"></i> Dashboard</a>
                        </li>
                        <li class="nav-item">
                            <a href="" class="nav-link with-sub"><i class="typcn typcn-document"></i> Pages</a>
                            <nav class="az-menu-sub">
                                <a href="{{ path('app_demo_signin') }}" class="nav-link">Sign In</a>
                                <a href="{{ path('app_demo_signup') }}" class="nav-link">Sign Up</a>
                            </nav>
                        </li>
                        <li class="nav-item">
                            <a href="{{ path('app_demo_chart') }}" class="nav-link"><i class="typcn typcn-chart-bar-outline"></i> Charts</a>
                        </li>
                        <li class="nav-item">
                            <a href="{{ path('app_demo_elements') }}" class="nav-link"><i class="typcn typcn-chart-bar-outline"></i> Forms</a>
                        </li>
                        <li class="nav-item active">
                            <a href="" class="nav-link with-sub"><i class="typcn typcn-book"></i> Components</a>
                            <div class="az-menu-sub">
                                <div class="container">
                                    <div>
                                        <nav class="nav">
                                            <a href="{{ path('app_demo_buttons') }}" class="nav-link">Buttons</a>
                                            <a href="{{ path('app_demo_dropdown') }}" class="nav-link">Dropdown</a>
                                            <a href="{{ path('app_demo_icons') }}" class="nav-link">Icons</a>
                                            <a href="{{ path('app_demo_table') }}" class="nav-link">Table</a>
                                        </nav>
                                    </div>
                                </div>
                                <!-- container -->
                            </div>
                        </li>
                    </ul>
                </div>
                <!-- az-header-menu -->
                <div class="az-header-right">
                    <a href="https://www.bootstrapdash.com/demo/azia-free/docs/documentation.html" target="_blank" class="az-header-search-link"><i class="far fa-file-alt"></i></a>
                    <a href="" class="az-header-search-link"><i class="fas fa-search"></i></a>
                    <div class="az-header-message">
                        <a href="#"><i class="typcn typcn-messages"></i></a>
                    </div>
                    <!-- az-header-message -->
                    <div class="dropdown az-header-notification">
                        <a href="" class="new"><i class="typcn typcn-bell"></i></a>
                        <div class="dropdown-menu">
                            <div class="az-dropdown-header mg-b-20 d-sm-none">
                                <a href="" class="az-header-arrow"><i class="icon ion-md-arrow-back"></i></a>
                            </div>
                            <h6 class="az-notification-title">Notifications</h6>
                            <p class="az-notification-text">You have 2 unread notification</p>
                            <div class="az-notification-list">
                                <div class="media new">
                                    <div class="az-img-user"><img src="{{ asset('assets/img/faces/face2.jpg') }}" alt=""></div>
                                    <div class="media-body">
                                        <p>Congratulate <strong>Socrates Itumay</strong> for work anniversaries</p>
                                        <span>Mar 15 12:32pm</span>
                                    </div>
                                    <!-- media-body -->
                                </div>
                                <!-- media -->
                                <div class="media new">
                                    <div class="az-img-user online"><img src="{{ asset('assets/img/faces/face3.jpg') }}" alt=""></div>
                                    <div class="media-body">
                                        <p><strong>Joyce Chua</strong> just created a new blog post</p>
                                        <span>Mar 13 04:16am</span>
                                    </div>
                                    <!-- media-body -->
                                </div>
                                <!-- media -->
                                <div class="media">
                                    <div class="az-img-user"><img src="{{ asset('assets/img/faces/face4.jpg') }}" alt=""></div>
                                    <div class="media-body">
                                        <p><strong>Althea Cabardo</strong> just created a new blog post</p>
                                        <span>Mar 13 02:56am</span>
                                    </div>
                                    <!-- media-body -->
                                </div>
                                <!-- media -->
                                <div class="media">
                                    <div class="az-img-user"><img src="{{ asset('assets/img/faces/face5.jpg') }}" alt=""></div>
                                    <div class="media-body">
                                        <p><strong>Adrian Monino</strong> added new comment on your photo</p>
                                        <span>Mar 12 10:40pm</span>
                                    </div>
                                    <!-- media-body -->
                                </div>
                                <!-- media -->
                            </div>
                            <!-- az-notification-list -->
                            <div class="dropdown-footer"><a href="">View All Notifications</a></div>
                        </div>
                        <!-- dropdown-menu -->
                    </div>
                    <!-- az-header-notification -->
                    <div class="dropdown az-profile-menu">
                        <a href="" class="az-img-user"><img src="{{ asset('assets/img/faces/face1.jpg') }}" alt=""></a>
                        <div class="dropdown-menu">
                            <div class="az-dropdown-header d-sm-none">
                                <a href="" class="az-header-arrow"><i class="icon ion-md-arrow-back"></i></a>
                            </div>
                            <div class="az-header-profile">
                                <div class="az-img-user">
                                    <img src="{{ asset('assets/img/faces/face1.jpg') }}" alt="">
                                </div>
                                <!-- az-img-user -->
                                <h6>Aziana Pechon</h6>
                                <span>Premium Member</span>
                            </div>
                            <!-- az-header-profile -->
                            <a href="" class="dropdown-item"><i class="typcn typcn-user-outline"></i> My Profile</a>
                            <a href="" class="dropdown-item"><i class="typcn typcn-edit"></i> Edit Profile</a>
                            <a href="" class="dropdown-item"><i class="typcn typcn-time"></i> Activity Logs</a>
                            <a href="" class="dropdown-item"><i class="typcn typcn-cog-outline"></i> Account Settings</a>
                            <a href="{{ path('app_demo_signin') }}" class="dropdown-item"><i class="typcn typcn-power-outline"></i> Sign Out</a>
                        </div>
                        <!-- dropdown-menu -->
                    </div>
                </div>
                <!-- az-header-right -->
            </div>
            <!-- container -->
        </div>
        <!-- az-header -->
        <div class="az-content pd-y-20 pd-lg-y-30 pd-xl-y-40">
            <div class="container">
                <div class="az-content-left az-content-left-components">
                    <div class="component-item">
                        <label>UI Elements</label>
                        <nav class="nav flex-column">
                            <a href="{{ path('app_demo_buttons') }}" class="nav-link">Buttons</a>
                            <a href="{{ path('app_demo_dropdown') }}" class="nav-link">Dropdown</a>
                            <a href="{{ path('app_demo_icons') }}" class="nav-link active">Icons</a>
                        </nav>
                        <label>Forms</label>
                        <nav class="nav flex-column">
                            <a href="{{ path('app_demo_elements') }}" class="nav-link">Form Elements</a>
                        </nav>
                        <label>Charts</label>
                        <nav class="nav flex-column">
                            <a href="{{ path('app_demo_chart') }}" class="nav-link">ChartJS</a>
                        </nav>
                        <label>Tables</label>
                        <nav class="nav flex-column">
                            <a href="{{ path('app_demo_table') }}" class="nav-link">Basic Tables</a>
                        </nav>
                    </div>
                    <!-- component-item -->
                </div>
                <!-- az-content-left -->
                <div class="az-content-body pd-lg-l-40 d-flex flex-column">
                    <div class="az-content-breadcrumb">
                        <span>Components</span>
                        <span>UI Elements</span>
                        <span>Icons</span>
                    </div>
                    <h2 class="az-content-title">Icons</h2>
                    <div class="az-content-label mg-b-5">FontAwesome Icons</div>
                    <p class="mg-b-20">The world’s most popular and easiest to use icon set just got an upgrade. More icons. More styles. More options.</p>
                    <div class="az-icon-group bg-gray-200">
                        <div class="row row-xs">
                            <div class="col"><i class="far fa-address-book"></i></div>
                            <div class="col"><i class="far fa-address-card"></i></div>
                            <div class="col"><i class="far fa-arrow-alt-circle-down"></i></div>
                            <div class="col"><i class="far fa-arrow-alt-circle-left"></i></div>
                            <div class="col"><i class="far fa-arrow-alt-circle-up"></i></div>
                            <div class="col"><i class="far fa-arrow-alt-circle-right"></i></div>
                            <div class="col"><i class="fas fa-ban"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-bell"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-bell-slash"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-bookmark"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-calendar"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-calendar-check"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <div class="az-icon-group bg-gray-800 tx-white">
                        <div class="row row-xs">
                            <div class="col"><i class="far fa-check-circle"></i></div>
                            <div class="col"><i class="far fa-clipboard"></i></div>
                            <div class="col"><i class="far fa-clock"></i></div>
                            <div class="col"><i class="far fa-clone"></i></div>
                            <div class="col"><i class="far fa-comment"></i></div>
                            <div class="col"><i class="far fa-compass"></i></div>
                            <div class="col"><i class="fas fa-desktop"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-envelope"></i></div>
                            <div class="col d-none d-sm-block"><i class="fas fa-envelope-open-text"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-eye"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-eye-slash"></i></div>
                            <div class="col d-none d-sm-block"><i class="far fa-file-alt"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <p class="mg-t-15 mg-b-0">See more FontAwesome icons at <a href="https://fontawesome.com/icons" target="_blank">FontAwesome Icons</a></p>
                    <hr class="mg-y-30">
                    <div class="az-content-label mg-b-5">Ionicons Icons</div>
                    <p class="mg-b-20">Premium designed icons for use in web, iOS, Android, and desktop apps. Support for SVG and web font.</p>
                    <div class="az-icon-group bg-gray-200">
                        <div class="row row-xs">
                            <div class="col"><i class="icon ion-md-alarm"></i></div>
                            <div class="col"><i class="icon ion-md-chatboxes"></i></div>
                            <div class="col"><i class="icon ion-md-copy"></i></div>
                            <div class="col"><i class="icon ion-md-cube"></i></div>
                            <div class="col"><i class="icon ion-md-filing"></i></div>
                            <div class="col"><i class="icon ion-md-eye"></i></div>
                            <div class="col"><i class="icon ion-md-globe"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-md-images"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-md-laptop"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-md-paper"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-md-paper-plane"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-md-pricetags"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <div class="az-icon-group bg-gray-800 tx-white">
                        <div class="row row-xs">
                            <div class="col"><i class="icon ion-ios-settings"></i></div>
                            <div class="col"><i class="icon ion-ios-stats"></i></div>
                            <div class="col"><i class="icon ion-ios-share-alt"></i></div>
                            <div class="col"><i class="icon ion-ios-rocket"></i></div>
                            <div class="col"><i class="icon ion-ios-rainy"></i></div>
                            <div class="col"><i class="icon ion-ios-print"></i></div>
                            <div class="col"><i class="icon ion-ios-pie"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-ios-person"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-ios-mic"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-ios-locate"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-ios-list-box"></i></div>
                            <div class="col d-none d-sm-block"><i class="icon ion-ios-home"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <p class="mg-t-15 mg-b-0">See more Ionicons icons at <a href="https://ionicons.com" target="_blank">Ionicons</a></p>
                    <hr class="mg-y-30">
                    <div class="az-content-label mg-b-5">Line Awesome</div>
                    <p class="mg-b-20">Replace Font Awesome with modern line icons with a single line of code. </p>
                    <div class="az-icon-group bg-gray-200">
                        <div class="row row-xs">
                            <div class="col"><i class="la la-archive"></i></div>
                            <div class="col"><i class="la la-bar-chart"></i></div>
                            <div class="col"><i class="la la-bell"></i></div>
                            <div class="col"><i class="la la-bug"></i></div>
                            <div class="col"><i class="la la-calendar"></i></div>
                            <div class="col"><i class="la la-camera"></i></div>
                            <div class="col"><i class="la la-cog"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-cube"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-envelope"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-film"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-folder"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-gift"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <div class="az-icon-group bg-gray-800 tx-white">
                        <div class="row row-xs">
                            <div class="col"><i class="la la-home"></i></div>
                            <div class="col"><i class="la la-inbox"></i></div>
                            <div class="col"><i class="la la-image"></i></div>
                            <div class="col"><i class="la la-life-buoy"></i></div>
                            <div class="col"><i class="la la-lock"></i></div>
                            <div class="col"><i class="la la-microphone"></i></div>
                            <div class="col"><i class="la la-phone"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-pie-chart"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-rocket"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-ship"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-sticky-note"></i></div>
                            <div class="col d-none d-sm-block"><i class="la la-tags"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <p class="mg-t-15 mg-b-0">See more Line Awesome icons at <a href="https://icons8.com/line-awesome" target="_blank">Line Awesome</a></p>
                    <hr class="mg-y-30">
                    <div class="az-content-label mg-b-5">Typicons Icons</div>
                    <p class="mg-b-20">Typicons are free-to-use vector icons embedded in a webfont for easy use in any UI, whether it be on the web or in a native app.</p>
                    <div class="az-icon-group bg-gray-200">
                        <div class="row row-xs">
                            <div class="col"><i class="typcn typcn-archive"></i></div>
                            <div class="col"><i class="typcn typcn-arrow-back-outline"></i></div>
                            <div class="col"><i class="typcn typcn-arrow-right-outline"></i></div>
                            <div class="col"><i class="typcn typcn-attachment-outline"></i></div>
                            <div class="col"><i class="typcn typcn-bell"></i></div>
                            <div class="col"><i class="typcn typcn-book"></i></div>
                            <div class="col"><i class="typcn typcn-bookmark"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-briefcase"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-calendar-outline"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-camera-outline"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-chart-pie-outline"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-coffee"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <div class="az-icon-group bg-gray-800 tx-white">
                        <div class="row row-xs">
                            <div class="col"><i class="typcn typcn-document-add"></i></div>
                            <div class="col"><i class="typcn typcn-document-delete"></i></div>
                            <div class="col"><i class="typcn typcn-document-text"></i></div>
                            <div class="col"><i class="typcn typcn-edit"></i></div>
                            <div class="col"><i class="typcn typcn-export-outline"></i></div>
                            <div class="col"><i class="typcn typcn-flash-outline"></i></div>
                            <div class="col"><i class="typcn typcn-folder-open"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-folder"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-group-outline"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-mail"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-message"></i></div>
                            <div class="col d-none d-sm-block"><i class="typcn typcn-shopping-cart"></i></div>
                        </div>
                        <!-- row -->
                    </div>
                    <p class="mg-t-15 mg-b-0">See more Typicons icons at <a href="https://www.s-ings.com/typicons/" target="_blank">Typicons Icons</a></p>
                    <div class="mg-lg-b-30"></div>
                    <div class="az-footer mg-t-auto">
                        <div class="container">
                            <span class="text-muted d-block text-center text-sm-left d-sm-inline-block">Copyright © bootstrapdash.com 2020</span>
                            <span class="float-none float-sm-right d-block mt-1 mt-sm-0 text-center"> Free <a href="https://www.bootstrapdash.com/bootstrap-admin-template/" target="_blank">Bootstrap admin templates</a> from Bootstrapdash.com</span>
                        </div>
                        <!-- container -->
                    </div>
                    <!-- az-footer -->
                </div>
                <!-- az-content-body -->
            </div>
            <!-- container -->
        </div>
        <!-- az-content -->
        <script src="{{ asset('assets/lib/jquery/jquery.min.js') }}"></script>
        <script src="{{ asset('assets/lib/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
        <script src="{{ asset('assets/lib/ionicons/ionicons.js') }}"></script>
        <script src="../js/jquery.cookie.js') }}" type="text/javascript"></script>
        <script src="{{ asset('assets/js/azia.js') }}"></script>
        <script>
            $(function(){
              'use strict'
            
            });
        </script>
    </body>
</html>

