代码拉取完成,页面将自动刷新
同步操作将从 lib_wiki/bootstrap-v4.0_demo 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="description" content="">
<meta name="author" content="">
<!-- Title -->
<title>Neptune</title>
<!-- Vendor CSS -->
<link rel="stylesheet" href="vendor/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="vendor/themify-icons/themify-icons.css">
<link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
<link rel="stylesheet" href="vendor/animate.css/animate.min.css">
<link rel="stylesheet" href="vendor/jscrollpane/jquery.jscrollpane.css">
<link rel="stylesheet" href="vendor/waves/waves.min.css">
<link rel="stylesheet" href="vendor/chartist/chartist.min.css">
<link rel="stylesheet" href="vendor/switchery/dist/switchery.min.css">
<link rel="stylesheet" href="vendor/material-design-iconic-font/css/material-design-iconic-font.min.css">
<!-- Neptune CSS -->
<link rel="stylesheet" href="css/core.css">
<!-- HTML5 Shiv and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="large-sidebar fixed-sidebar fixed-header">
<div class="wrapper">
<!-- Preloader -->
<div class="preloader"></div>
<!-- Sidebar -->
<div class="site-sidebar-overlay"></div>
<div class="site-sidebar">
<a class="logo" href="index.html">
<span class="l-text">Neptune</span>
<span class="l-icon"></span>
</a>
<div class="custom-scroll custom-scroll-light">
<ul class="sidebar-menu">
<li class="menu-title m-t-0-5">Navigation</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-dashboard"></i></span>
<span class="s-text">Dashboard</span>
</a>
<ul>
<li><a href="index.html">Dashboard 1</a></li>
<li><a href="index2.html">Dashboard 2</a></li>
<li><a href="index3.html">Dashboard 3</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="tag tag-danger">7</span>
<span class="s-icon"><i class="ti-package"></i></span>
<span class="s-text">Widgets</span>
</a>
<ul>
<li><a href="widgets-blog.html">Blog</a></li>
<li><a href="widgets-social.html">Social</a></li>
<li><a href="widgets-ecommerce.html">Ecommerce</a></li>
<li><a href="widgets-navigation.html">Navigation</a></li>
<li><a href="widgets-headers.html">Headers</a></li>
<li><a href="widgets-footers.html">Footers</a></li>
<li><a href="widgets-tiles.html">Tiles</a></li>
<li><a href="widgets-modals.html">Modals</a></li>
</ul>
</li>
<li class="menu-title">Main</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="tag tag-purple">12</span>
<span class="s-icon"><i class="ti-paint-bucket"></i></span>
<span class="s-text">UI Kit</span>
</a>
<ul>
<li><a href="ui-buttons.html">Buttons</a></li>
<li><a href="ui-dropdowns.html">Dropdowns</a></li>
<li><a href="ui-notifications.html">Notifications</a></li>
<li><a href="ui-cards.html">Cards</a></li>
<li><a href="ui-navs.html">Navs</a></li>
<li><a href="ui-progress.html">Progress</a></li>
<li><a href="ui-modal.html">Modal</a></li>
<li><a href="ui-carousel.html">Carousel</a></li>
<li><a href="ui-typography.html">Typography</a></li>
<li><a href="ui-grid.html">Grid</a></li>
<li><a href="ui-other.html">Other</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-pencil-alt"></i></span>
<span class="s-text">Forms</span>
</a>
<ul>
<li><a href="forms-basic.html">Basic Elements</a></li>
<li><a href="forms-editors.html">Editors</a></li>
<li><a href="forms-plugins.html">Plugins</a></li>
<li><a href="forms-pickers.html">Form Pickers</a></li>
<li><a href="forms-masks.html">Form Masks</a></li>
<li><a href="forms-wizard.html">Form Wizard</a></li>
<li><a href="forms-xeditable.html">X-editable</a></li>
<li><a href="forms-upload.html">File Upload</a></li>
<li><a href="forms-typeahead.html">Typeahead</a></li>
<li><a href="forms-range-slider.html">Range Slider</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-menu-alt"></i></span>
<span class="s-text">Tables</span>
</a>
<ul>
<li><a href="tables-basic.html">Basic Tables</a></li>
<li><a href="tables-datatable.html">Data Tables</a></li>
<li><a href="tables-editable.html">Editable Tables</a></li>
<li><a href="tables-responsive.html">Responsive Tables</a></li>
<li><a href="tables-jsgrid.html">jsGrid Tables</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="tag tag-success">3</span>
<span class="s-icon"><i class="ti-gallery"></i></span>
<span class="s-text">Pages</span>
</a>
<ul>
<li><a href="pages-blank.html">Blank</a></li>
<li><a href="pages-403.html">Error 403</a></li>
<li><a href="pages-404.html">Error 404</a></li>
<li><a href="pages-500.html">Error 500</a></li>
<li><a href="pages-faq.html">FAQ</a></li>
<li><a href="pages-invoice.html">Invoice</a></li>
<li><a href="pages-profile.html">Profile</a></li>
<li><a href="pages-sign-in.html">Sign In</a></li>
<li><a href="pages-sign-in2.html">Sign In 2</a></li>
<li><a href="pages-reset-password.html">Reset Password</a></li>
<li><a href="pages-sign-up.html">Sign Up</a></li>
<li><a href="pages-contactform.html">Contact Form</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-view-grid"></i></span>
<span class="s-text">Apps</span>
</a>
<ul>
<li><a href="apps-inbox.html">Inbox</a></li>
<li><a href="apps-chat.html">Chat</a></li>
<li><a href="apps-contacts.html">Contacts</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-star"></i></span>
<span class="s-text">Icons</span>
</a>
<ul>
<li><a href="icons-fontawesome.html">Font Awesome</a></li>
<li><a href="icons-material.html">Material Design</a></li>
<li><a href="icons-themify.html">Themify Icons</a></li>
<li><a href="icons-weather.html">Weather Icons</a></li>
<li><a href="icons-ionicons.html">Ionicons</a></li>
<li><a href="icons-typicons.html">Typicons</a></li>
<li><a href="icons-pe7.html">Pe7 Icons</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-settings"></i></span>
<span class="s-text">Utilities</span>
</a>
<ul>
<li><a href="utilities-color.html">Color utilities</a></li>
<li><a href="utilities-border.html">Border utilities</a></li>
<li><a href="utilities-other.html">Other utilities</a></li>
</ul>
</li>
<li class="menu-title">More</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-location-arrow"></i></span>
<span class="s-text">Extra</span>
</a>
<ul>
<li><a href="extra-animations.html">Animations</a></li>
<li><a href="extra-comments.html">Comments</a></li>
<li><a href="extra-lightbox.html">Lightbox</a></li>
<li><a href="extra-nestable.html">Nestable</a></li>
<li><a href="extra-crop.html">Image Crop</a></li>
<li><a href="extra-loading-progress.html">Loading Progress</a></li>
<li><a href="extra-prices.html">Prices</a></li>
<li><a href="extra-timeline.html">Timeline</a></li>
<li><a href="extra-search.html">Search</a></li>
<li><a href="extra-scrollbar.html">Scroll Bar</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-new-window"></i></span>
<span class="s-text">Frontend</span>
</a>
<ul>
<li><a href="frontend.html">Frontend 1</a></li>
<li><a href="frontend2.html">Frontend 2</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="tag tag-info">6</span>
<span class="s-icon"><i class="ti-bar-chart-alt"></i></span>
<span class="s-text">Charts</span>
</a>
<ul>
<li><a href="charts-flot.html">Flot Chart</a></li>
<li><a href="charts-morris.html">Morris Chart</a></li>
<li><a href="charts-chartjs.html">Chart.js</a></li>
<li><a href="charts-peity.html">Peity Chart</a></li>
<li><a href="charts-sparkline.html">Sparkline Chart</a></li>
<li><a href="charts-chartist.html">Chartist Chart</a></li>
<li><a href="charts-easy.html">Easy Pie Chart</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-email"></i></span>
<span class="s-text">Email Templates</span>
</a>
<ul>
<li><a href="email-basic.html">Basic</a></li>
<li><a href="email-alert.html">Alert</a></li>
<li><a href="email-ecommerce.html">Ecommerce</a></li>
</ul>
</li>
<li class="with-sub">
<a href="#" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-location-pin"></i></span>
<span class="s-text">Maps</span>
</a>
<ul>
<li><a href="maps-vector.html">Vector Map</a></li>
<li><a href="maps-google.html">Google Map</a></li>
</ul>
</li>
<li>
<a href="calendar.html" class="waves-effect waves-light">
<span class="s-icon"><i class="ti-calendar"></i></span>
<span class="s-text">Calendar</span>
</a>
</li>
<li class="with-sub compact-hide">
<a href="javascript: void(0);" class="waves-effect waves-light">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-icon"><i class="ti-menu"></i></span>
<span class="s-text">Menu Levels</span>
</a>
<ul>
<li class="with-sub">
<a href="javascript: void(0);">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-text">Level 1</span>
</a>
<ul>
<li class="with-sub">
<a href="javascript: void(0);">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-text">Level 1.2</span>
</a>
<ul>
<li class="with-sub">
<a href="javascript: void(0);">
<span class="s-caret"><i class="fa fa-angle-down"></i></span>
<span class="s-text">Level 1.2.3</span>
</a>
<ul>
<li><a href="javascript: void(0);">Level 1.2.3.4</a></li>
<li><a href="javascript: void(0);">Level 1.2.3.4</a></li>
</ul>
</li>
<li><a href="javascript: void(0);">Level 1.2.3</a></li>
</ul>
</li>
<li><a href="javascript: void(0);">Level 1.2</a></li>
</ul>
</li>
<li><a href="javascript: void(0);">Level 1</a></li>
</ul>
</li>
<li class="menu-title compact-hide">Unique Visitors</li>
<li class="compact-hide">
<div id="sidebar-chart" class="chartist-animated chartist-light"></div>
</li>
<li class="menu-title compact-hide">Tags</li>
<li class="compact-hide">
<a href="javascript: void(0);" class="waves-effect waves-light">
<span class="s-icon"><i class="fa fa-circle-o text-danger"></i></span>
<span class="s-text">Ideas</span>
</a>
</li>
<li class="compact-hide">
<a href="javascript: void(0);" class="waves-effect waves-light">
<span class="s-icon"><i class="fa fa-circle-o text-warning"></i></span>
<span class="s-text">Projects</span>
</a>
</li>
<li class="compact-hide">
<a href="documentation.html" class="waves-effect waves-light">
<span class="s-icon"><i class="fa fa-circle-o text-primary"></i></span>
<span class="s-text">Documentation</span>
</a>
</li>
</ul>
</div>
</div>
<!-- Sidebar second -->
<div class="site-sidebar-second custom-scroll custom-scroll-dark">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="tab" href="#tab-1" role="tab">Chat</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tab-2" role="tab">Activity</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tab-3" role="tab">Todo</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#tab-4" role="tab">Settings</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="tab-1" role="tabpanel">
<div class="sidebar-chat animated fadeIn">
<div class="sidebar-group">
<h6>Favorites</h6>
<a class="text-black" href="#">
<span class="sc-status bg-success"></span>
<span class="sc-name">John Doe</span>
<span class="sc-writing"> typing...<i class="ti-pencil"></i></span>
</a>
<a class="text-black" href="#">
<span class="sc-status bg-success"></span>
<span class="sc-name">Vance Osborn</span>
</a>
<a class="text-black" href="#">
<span class="sc-status bg-danger"></span>
<span class="sc-name">Wolfe Stevie</span>
<span class="tag tag-primary">7</span>
</a>
<a class="text-black" href="#">
<span class="sc-status bg-warning"></span>
<span class="sc-name">Jonathan Mel</span>
</a>
<a class="text-black" href="#">
<span class="sc-status bg-secondary"></span>
<span class="sc-name">Carleton Josiah</span>
</a>
</div>
<div class="sidebar-group">
<h6>Work</h6>
<a class="text-black" href="#">
<span class="sc-status bg-secondary"></span>
<span class="sc-name">Larry Hal</span>
</a>
<a class="text-black" href="#">
<span class="sc-status bg-success"></span>
<span class="sc-name">Ron Carran</span>
<span class="sc-writing"> typing...<i class="ti-pencil"></i></span>
</a>
</div>
<div class="sidebar-group">
<h6>Social</h6>
<a class="text-black" href="#">
<span class="sc-status bg-success"></span>
<span class="sc-name">Lucius Skyler</span>
<span class="tag tag-primary">3</span>
</a>
<a class="text-black" href="#">
<span class="sc-status bg-danger"></span>
<span class="sc-name">Landon Graham</span>
</a>
</div>
</div>
<div class="sidebar-chat-window animated fadeIn">
<div class="scw-header clearfix">
<a class="text-grey pull-xs-left" href="#"><i class="ti-angle-left"></i> Back</a>
<div class="pull-xs-right">
<strong>Jonathan Mel</strong>
<div class="avatar box-32">
<img src="img/avatars/5.jpg" alt="">
<span class="status bg-success top right"></span>
</div>
</div>
</div>
<div class="scw-item">
<span>Hello!</span>
</div>
<div class="scw-item self">
<span>Meeting at 16:00 in the conference room. Remember?</span>
</div>
<div class="scw-item">
<span>No problem. Thank's for reminder!</span>
</div>
<div class="scw-item self">
<span>Prepare to be amazed.</span>
</div>
<div class="scw-item">
<span>Good. Can't wait!</span>
</div>
<div class="scw-form">
<form>
<input class="form-control" type="text" placeholder="Type...">
<button class="btn btn-secondary" type="button"><i class="ti-angle-right"></i></button>
</form>
</div>
</div>
</div>
<div class="tab-pane" id="tab-2" role="tabpanel">
<div class="sidebar-activity animated fadeIn">
<div class="notifications">
<div class="n-item">
<div class="media">
<div class="media-left">
<div class="avatar box-48">
<img class="b-a-radius-circle" src="img/avatars/1.jpg" alt="">
<span class="n-icon bg-danger"><i class="ti-pin-alt"></i></span>
</div>
</div>
<div class="media-body">
<div class="n-text"><a class="text-black" href="#">John Doe</a> <span class="text-muted">uploaded <a class="text-black" href="#">monthly report</a></div>
<div class="text-muted font-90">12 minutes ago</div>
</div>
</div>
</div>
<div class="n-item">
<div class="media">
<div class="media-left">
<div class="avatar box-48">
<img class="b-a-radius-circle" src="img/avatars/3.jpg" alt="">
<span class="n-icon bg-success"><i class="ti-comment"></i></span>
</div>
</div>
<div class="media-body">
<div class="n-text"><a class="text-black" href="#">Vance Osborn</a> <span class="text-muted">commented </span> <a class="text-black" href="#">Project</a></div>
<div class="n-comment m-y-0-5">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore</div>
<div class="text-muted font-90">3 hours ago</div>
</div>
</div>
</div>
<div class="n-item">
<div class="media">
<div class="media-left">
<div class="avatar box-48">
<img class="b-a-radius-circle" src="img/avatars/2.jpg" alt="">
<span class="n-icon bg-danger"><i class="ti-email"></i></span>
</div>
</div>
<div class="media-body">
<div class="n-text"><a class="text-black" href="#">Ron Carran</a> <span class="text-muted">send you files</span></div>
<div class="row row-sm m-y-0-5">
<div class="col-xs-4">
<img class="img-fluid" src="img/photos-1/1.jpg" alt="">
</div>
<div class="col-xs-4">
<img class="img-fluid" src="img/photos-1/2.jpg" alt="">
</div>
<div class="col-xs-4">
<img class="img-fluid" src="img/photos-1/3.jpg" alt="">
</div>
</div>
<div class="text-muted font-90">30 minutes ago</div>
</div>
</div>
</div>
<div class="n-item">
<div class="media">
<div class="media-left">
<div class="avatar box-48">
<img class="b-a-radius-circle" src="img/avatars/4.jpg" alt="">
<span class="n-icon bg-primary"><i class="ti-plus"></i></span>
</div>
</div>
<div class="media-body">
<div class="n-text"><a class="text-black" href="#">Larry Hal</a> <span class="text-muted">invited you to </span><a class="text-black" href="#">Project</a></div>
<div class="text-muted font-90">10:58</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tab-3" role="tabpanel">
<div class="sidebar-todo animated fadeIn">
<div class="sidebar-group">
<h6>Important</h6>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Mock up</span>
</label>
</div>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" checked>
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Prototype iPhone</span>
</label>
</div>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Build final version</span>
</label>
</div>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Approval docs</span>
</label>
</div>
</div>
<div class="sidebar-group">
<h6>Secondary</h6>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" checked>
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Website redesign</span>
</label>
</div>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" checked>
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Skype call</span>
</label>
</div>
<div class="st-item">
<label class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input">
<span class="custom-control-indicator"></span>
<span class="custom-control-description">Blog post</span>
</label>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="tab-4" role="tabpanel">
<div class="sidebar-settings animated fadeIn">
<div class="sidebar-group">
<h6>Main</h6>
<div class="ss-item">
<div class="text-truncate">Anyone can register</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9" checked></div>
</div>
<div class="ss-item">
<div class="text-truncate">Allow commenting</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9"></div>
</div>
<div class="ss-item">
<div class="text-truncate">Allow deleting</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9"></div>
</div>
</div>
<div class="sidebar-group">
<h6>Notificatiоns</h6>
<div class="ss-item">
<div class="text-truncate">Commits</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9"></div>
</div>
<div class="ss-item">
<div class="text-truncate">Messages</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9" checked></div>
</div>
</div>
<div class="sidebar-group">
<h6>Security</h6>
<div class="ss-item">
<div class="text-truncate">Daily backup</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9" checked></div>
</div>
<div class="ss-item">
<div class="text-truncate">API Access</div>
<div class="ss-checkbox"><input type="checkbox" class="js-switch" data-size="small" data-color="#3e70c9" checked></div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Template options -->
<div class="template-options custom-scroll custom-scroll-dark">
<div class="to-toggle"><i class="ti-settings"></i></div>
<div class="to-content">
<h6>Layouts</h6>
<div class="row m-b-2 text-xs-center">
<div class="col-xs-6 m-b-2">
<a href="index.html">
<img src="img/layouts/1.png" class="img-fluid">
</a>
<div class="text-muted">Default</div>
</div>
<div class="col-xs-6 m-b-2">
<label>
<input name="compact-sidebar" type="checkbox">
<div class="to-icon"><i class="ti-check"></i></div>
<img src="img/layouts/2.png" class="img-fluid">
</label>
<div class="text-muted">Compact Sidebar</div>
</div>
<div class="col-xs-6 m-b-2">
<label>
<input name="fixed-header" type="checkbox" checked>
<div class="to-icon"><i class="ti-check"></i></div>
<img src="img/layouts/3.png" class="img-fluid">
</label>
<div class="text-muted">Fixed Header</div>
</div>
<div class="col-xs-6 m-b-2">
<label>
<input name="boxed-wrapper" type="checkbox">
<div class="to-icon"><i class="ti-check"></i></div>
<img src="img/layouts/4.png" class="img-fluid">
</label>
<div class="text-muted">Boxed Wrapper</div>
</div>
</div>
<h6>Skins</h6>
<div class="row">
<div class="col-xs-3 m-b-2">
<label>
<input name="skin" value="skin-default" type="radio" checked>
<div class="to-icon"><i class="ti-check"></i></div>
<div class="to-skin">
<span class="skin-first bg-white"></span>
<span class="skin-second skin-dark-blue"></span>
<span class="skin-third bg-info"></span>
</div>
</label>
</div>
<div class="col-xs-3 m-b-2">
<label>
<input name="skin" value="skin-1" type="radio">
<div class="to-icon"><i class="ti-check"></i></div>
<div class="to-skin">
<span class="skin-first skin-dark-blue-2"></span>
<span class="skin-second bg-white"></span>
<span class="skin-third bg-danger"></span>
</div>
</label>
</div>
<div class="col-xs-3 m-b-2">
<label>
<input name="skin" value="skin-2" type="radio">
<div class="to-icon"><i class="ti-check"></i></div>
<div class="to-skin">
<span class="skin-first bg-white"></span>
<span class="skin-second bg-black"></span>
<span class="skin-third bg-success"></span>
</div>
</label>
</div>
<div class="col-xs-3 m-b-2">
<label>
<input name="skin" value="skin-3" type="radio">
<div class="to-icon"><i class="ti-check"></i></div>
<div class="to-skin">
<span class="skin-first bg-white"></span>
<span class="skin-second skin-grey"></span>
<span class="skin-third bg-purple"></span>
</div>
</label>
</div>
<div class="col-xs-3 m-b-2">
<label>
<input name="skin" value="skin-4" type="radio">
<div class="to-icon"><i class="ti-check"></i></div>
<div class="to-skin">
<span class="skin-first skin-dark-blue"></span>
<span class="skin-second skin-dark-blue-2"></span>
<span class="skin-third bg-warning"></span>
</div>
</label>
</div>
<div class="col-xs-3 m-b-2">
<label>
<input name="skin" value="skin-5" type="radio">
<div class="to-icon"><i class="ti-check"></i></div>
<div class="to-skin">
<span class="skin-first bg-primary"></span>
<span class="skin-second bg-white"></span>
<span class="skin-third bg-primary"></span>
</div>
</label>
</div>
</div>
</div>
</div>
<!-- Header -->
<div class="site-header">
<nav class="navbar navbar-light">
<ul class="nav navbar-nav">
<li class="nav-item m-r-1 hidden-lg-up">
<a class="nav-link collapse-button" href="#">
<i class="ti-menu"></i>
</a>
</li>
</ul>
<ul class="nav navbar-nav pull-xs-right">
<li class="nav-item dropdown">
<a class="nav-link" href="#" data-toggle="dropdown" aria-expanded="false">
<i class="ti-check"></i>
<span class="tag tag-success top">3</span>
</a>
<div class="dropdown-tasks dropdown-menu dropdown-menu-right animated slideInUp">
<div class="t-item">
<div class="m-b-0-5">
<a class="text-black" href="#">First Task</a>
<span class="pull-xs-right text-muted">75%</span>
</div>
<progress class="progress progress-danger progress-sm" value="75" max="100">100%</progress>
<span class="avatar box-32">
<img src="img/avatars/2.jpg" alt="">
</span>
<a class="text-black" href="#">John Doe</a>, <span class="text-muted">5 min ago</span>
</div>
<div class="t-item">
<div class="m-b-0-5">
<a class="text-black" href="#">Second Task</a>
<span class="pull-xs-right text-muted">40%</span>
</div>
<progress class="progress progress-purple progress-sm" value="40" max="100">100%</progress>
<span class="avatar box-32">
<img src="img/avatars/3.jpg" alt="">
</span>
<a class="text-black" href="#">John Doe</a>, <span class="text-muted">15:07</span>
</div>
<div class="t-item">
<div class="m-b-0-5">
<a class="text-black" href="#">Third Task</a>
<span class="pull-xs-right text-muted">100%</span>
</div>
<progress class="progress progress-warning progress-sm" value="100" max="100">100%</progress>
<span class="avatar box-32">
<img src="img/avatars/4.jpg" alt="">
</span>
<a class="text-black" href="#">John Doe</a>, <span class="text-muted">yesterday</span>
</div>
<div class="t-item">
<div class="m-b-0-5">
<a class="text-black" href="#">Fourth Task</a>
<span class="pull-xs-right text-muted">60%</span>
</div>
<progress class="progress progress-success progress-sm" value="60" max="100">100%</progress>
<span class="avatar box-32">
<img src="img/avatars/5.jpg" alt="">
</span>
<a class="text-black" href="#">John Doe</a>, <span class="text-muted">3 days ago</span>
</div>
<a class="t-item text-black text-xs-center" href="#">
<strong>View all tasks</strong>
</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link" href="#" data-toggle="dropdown" aria-expanded="false">
<i class="ti-bell"></i>
<span class="tag tag-danger top">12</span>
</a>
<div class="dropdown-messages dropdown-tasks dropdown-menu dropdown-menu-right animated slideInUp">
<div class="m-item">
<div class="mi-icon bg-info"><i class="ti-comment"></i></div>
<div class="mi-text"><a class="text-black" href="#">John Doe</a> <span class="text-muted">commented post</span> <a class="text-black" href="#">Lorem ipsum dolor</a></div>
<div class="mi-time">5 min ago</div>
</div>
<div class="m-item">
<div class="mi-icon bg-danger"><i class="ti-heart"></i></div>
<div class="mi-text"><a class="text-black" href="#">John Doe</a> <span class="text-muted">liked post</span> <a class="text-black" href="#">Lorem ipsum dolor</a></div>
<div class="mi-time">15:07</div>
</div>
<div class="m-item">
<div class="mi-icon bg-purple"><i class="ti-user"></i></div>
<div class="mi-text"><a class="text-black" href="#">John Doe</a> <span class="text-muted">followed</span> <a class="text-black" href="#">Kate Doe</a></div>
<div class="mi-time">yesterday</div>
</div>
<div class="m-item">
<div class="mi-icon bg-danger"><i class="ti-heart"></i></div>
<div class="mi-text"><a class="text-black" href="#">John Doe</a> <span class="text-muted">liked post</span> <a class="text-black" href="#">Lorem ipsum dolor</a></div>
<div class="mi-time">3 days ago</div>
</div>
<a class="t-item text-black text-xs-center" href="#">
<strong>View all notifications</strong>
</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link" href="#" data-toggle="dropdown" aria-expanded="false">
<div class="avatar box-32">
<img src="img/avatars/1.jpg" alt="">
</div>
</a>
<div class="dropdown-menu dropdown-menu-right animated flipInY">
<a class="dropdown-item" href="#">
<i class="ti-email m-r-0-5"></i> Inbox
</a>
<a class="dropdown-item" href="#">
<i class="ti-user m-r-0-5"></i> Profile
</a>
<a class="dropdown-item" href="#">
<i class="ti-settings m-r-0-5"></i> Settings
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#"><i class="ti-help m-r-0-5"></i> Help</a>
<a class="dropdown-item" href="#"><i class="ti-power-off m-r-0-5"></i> Sign out</a>
</div>
</li>
<li class="nav-item hidden-md-up">
<a class="nav-link" href="#" data-toggle="collapse" data-target="#collapse-1">
<i class="ti-more"></i>
</a>
</li>
<li class="nav-item">
<a class="nav-link site-sidebar-second-toggle" href="#" data-toggle="collapse">
<i class="ti-arrow-left"></i>
</a>
</li>
</ul>
<div class="navbar-toggleable-sm collapse" id="collapse-1">
<div class="header-form pull-md-left m-md-r-1">
<form>
<input type="text" class="form-control b-a" placeholder="Search for...">
<button type="submit" class="btn bg-white b-a-0">
<i class="ti-search"></i>
</button>
</form>
</div>
<ul class="nav navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" aria-expanded="false">
Add
</a>
<div class="dropdown-menu animated flipInY">
<a class="dropdown-item" href="#">
Link
<span class="tag tag-primary">3</span>
</a>
<a class="dropdown-item" href="#">Another link</a>
<a class="dropdown-item" href="#">
Something else here
<span class="tag tag-success">7</span>
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Separated link</a>
</div>
</li>
</ul>
</div>
</nav>
</div>
<div class="site-content">
<!-- Content -->
<div class="content-area p-y-1">
<div class="container-fluid">
<h4>Material Design Icons</h4>
<ol class="breadcrumb no-bg m-b-1">
<li class="breadcrumb-item"><a href="#">Home</a></li>
<li class="breadcrumb-item"><a href="#">Icons</a></li>
<li class="breadcrumb-item active">Material Design Icons</li>
</ol>
<div class="box box-block bg-white">
<h5>33 New Icons in 2.2</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-group"></i> group
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-rss"></i> rss
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shape"></i> shape
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-spinner"></i> spinner
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-ungroup"></i> ungroup
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-500px"></i> 500px
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-8tracks"></i> 8tracks
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-amazon"></i> amazon
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-blogger"></i> blogger
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-delicious"></i> delicious
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-disqus"></i> disqus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flattr"></i> flattr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flickr"></i> flickr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-github-alt"></i> github-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-old"></i> google-old
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-linkedin"></i> linkedin
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-odnoklassniki"></i> odnoklassniki
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-outlook"></i> outlook
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-paypal-alt"></i> paypal-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pinterest"></i> pinterest
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-playstation"></i> playstation
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-reddit"></i> reddit
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-skype"></i> skype
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-slideshare"></i> slideshare
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-soundcloud"></i> soundcloud
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tumblr"></i> tumblr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-twitch"></i> twitch
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-vimeo"></i> vimeo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-whatsapp"></i> whatsapp
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-xbox"></i> xbox
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-yahoo"></i> yahoo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-youtube-play"></i> youtube-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-youtube"></i> youtube
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Web Application</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-3d-rotation"></i> 3d-rotation
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airplane-off"></i> airplane-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airplane"></i> airplane
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-album"></i> album
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-archive"></i> archive
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment-account"></i> assignment-account
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment-alert"></i> assignment-alert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment-check"></i> assignment-check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment-o"></i> assignment-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment-return"></i> assignment-return
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment-returned"></i>
assignment-returned
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-assignment"></i> assignment
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-attachment-alt"></i> attachment-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-attachment"></i> attachment
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-audio"></i> audio
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-badge-check"></i> badge-check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-balance-wallet"></i> balance-wallet
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-balance"></i> balance
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-battery-alert"></i> battery-alert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-battery-flash"></i> battery-flash
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-battery-unknown"></i> battery-unknown
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-battery"></i> battery
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bike"></i> bike
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-block-alt"></i> block-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-block"></i> block
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-boat"></i> boat
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-book-image"></i> book-image
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-book"></i> book
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bookmark-outline"></i> bookmark-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bookmark"></i> bookmark
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brush"></i> brush
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bug"></i> bug
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bus"></i> bus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cake"></i> cake
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-car-taxi"></i> car-taxi
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-car-wash"></i> car-wash
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-car"></i> car
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-giftcard"></i> card-giftcard
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-membership"></i> card-membership
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-travel"></i> card-travel
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card"></i> card
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-case-check"></i> case-check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-case-download"></i> case-download
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-case-play"></i> case-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-case"></i> case
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cast-connected"></i> cast-connected
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cast"></i> cast
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-chart-donut"></i> chart-donut
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-chart"></i> chart
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-city-alt"></i> city-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-city"></i> city
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-close-circle-o"></i> close-circle-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-close-circle"></i> close-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-close"></i> close
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cocktail"></i> cocktail
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-code-setting"></i> code-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-code-smartphone"></i> code-smartphone
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-code"></i> code
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-coffee"></i> coffee
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-bookmark"></i>
collection-bookmark
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-case-play"></i>
collection-case-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-folder-image"></i>
collection-folder-image
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-image-o"></i> collection-image-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-image"></i> collection-image
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-1"></i> collection-item-1
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-2"></i> collection-item-2
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-3"></i> collection-item-3
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-4"></i> collection-item-4
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-5"></i> collection-item-5
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-6"></i> collection-item-6
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-7"></i> collection-item-7
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-8"></i> collection-item-8
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-9-plus"></i>
collection-item-9-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item-9"></i> collection-item-9
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-item"></i> collection-item
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-music"></i> collection-music
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-pdf"></i> collection-pdf
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-plus"></i> collection-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-speaker"></i> collection-speaker
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-text"></i> collection-text
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-collection-video"></i> collection-video
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-compass"></i> compass
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cutlery"></i> cutlery
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-delete"></i> delete
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dialpad"></i> dialpad
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dns"></i> dns
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-drink"></i> drink
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-edit"></i> edit
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-email-open"></i> email-open
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-email"></i> email
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-eye-off"></i> eye-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-eye"></i> eye
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-eyedropper"></i> eyedropper
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-favorite-outline"></i> favorite-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-favorite"></i> favorite
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-filter-list"></i> filter-list
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-fire"></i> fire
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flag"></i> flag
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flare"></i> flare
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flash-auto"></i> flash-auto
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flash-off"></i> flash-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flash"></i> flash
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flip"></i> flip
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flower-alt"></i> flower-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flower"></i> flower
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-font"></i> font
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-fullscreen-alt"></i> fullscreen-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-fullscreen-exit"></i> fullscreen-exit
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-fullscreen"></i> fullscreen
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-functions"></i> functions
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gas-station"></i> gas-station
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gesture"></i> gesture
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-globe-alt"></i> globe-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-globe-lock"></i> globe-lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-globe"></i> globe
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-graduation-cap"></i> graduation-cap
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-group"></i> group
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-home"></i> home
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hospital-alt"></i> hospital-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hospital"></i> hospital
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hotel"></i> hotel
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hourglass-alt"></i> hourglass-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hourglass-outline"></i> hourglass-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hourglass"></i> hourglass
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-http"></i> http
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-image-alt"></i> image-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-image-o"></i> image-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-image"></i> image
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-inbox"></i> inbox
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-invert-colors-off"></i> invert-colors-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-invert-colors"></i> invert-colors
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-key"></i> key
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-label-alt-outline"></i> label-alt-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-label-alt"></i> label-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-label-heart"></i> label-heart
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-label"></i> label
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-labels"></i> labels
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-lamp"></i> lamp
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-landscape"></i> landscape
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-layers-off"></i> layers-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-layers"></i> layers
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-library"></i> library
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-link"></i> link
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-lock-open"></i> lock-open
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-lock-outline"></i> lock-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-lock"></i> lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mail-reply-all"></i> mail-reply-all
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mail-reply"></i> mail-reply
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mail-send"></i> mail-send
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mall"></i> mall
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-map"></i> map
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-menu"></i> menu
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-money-box"></i> money-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-money-off"></i> money-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-money"></i> money
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-more-vert"></i> more-vert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-more"></i> more
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-movie-alt"></i> movie-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-movie"></i> movie
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-nature-people"></i> nature-people
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-nature"></i> nature
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-navigation"></i> navigation
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-open-in-browser"></i> open-in-browser
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-open-in-new"></i> open-in-new
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-palette"></i> palette
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-parking"></i> parking
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-account"></i> pin-account
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-assistant"></i> pin-assistant
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-drop"></i> pin-drop
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-help"></i> pin-help
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-off"></i> pin-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin"></i> pin
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pizza"></i> pizza
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plaster"></i> plaster
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-power-setting"></i> power-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-power"></i> power
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-print"></i> print
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-puzzle-piece"></i> puzzle-piece
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-quote"></i> quote
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-railway"></i> railway
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-receipt"></i> receipt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-refresh-alt"></i> refresh-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-refresh-sync-alert"></i> refresh-sync-alert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-refresh-sync-off"></i> refresh-sync-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-refresh-sync"></i> refresh-sync
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-refresh"></i> refresh
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-roller"></i> roller
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-ruler"></i> ruler
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-scissors"></i> scissors
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-screen-rotation-lock"></i>
screen-rotation-lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-screen-rotation"></i> screen-rotation
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-search-for"></i> search-for
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-search-in-file"></i> search-in-file
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-search-in-page"></i> search-in-page
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-search-replace"></i> search-replace
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-search"></i> search
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-seat"></i> seat
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-settings-square"></i> settings-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-settings"></i> settings
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shape"></i> shape
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shield-check"></i> shield-check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shield-security"></i> shield-security
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shopping-basket"></i> shopping-basket
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shopping-cart-plus"></i> shopping-cart-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shopping-cart"></i> shopping-cart
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sign-in"></i> sign-in
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sort-amount-asc"></i> sort-amount-asc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sort-amount-desc"></i> sort-amount-desc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sort-asc"></i> sort-asc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sort-desc"></i> sort-desc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-spellcheck"></i> spellcheck
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-spinner"></i> spinner
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-storage"></i> storage
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-store-24"></i> store-24
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-store"></i> store
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-subway"></i> subway
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sun"></i> sun
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tab-unselected"></i> tab-unselected
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tab"></i> tab
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tag-close"></i> tag-close
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tag-more"></i> tag-more
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tag"></i> tag
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-thumb-down"></i> thumb-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-thumb-up-down"></i> thumb-up-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-thumb-up"></i> thumb-up
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-ticket-star"></i> ticket-star
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-toll"></i> toll
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-toys"></i> toys
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-traffic"></i> traffic
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-translate"></i> translate
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-triangle-down"></i> triangle-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-triangle-up"></i> triangle-up
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-truck"></i> truck
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-turning-sign"></i> turning-sign
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-ungroup"></i> ungroup
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wallpaper"></i> wallpaper
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-washing-machine"></i> washing-machine
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-window-maximize"></i> window-maximize
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-window-minimize"></i> window-minimize
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-window-restore"></i> window-restore
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wrench"></i> wrench
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-zoom-in"></i> zoom-in
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-zoom-out"></i> zoom-out
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Notifications</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alert-circle-o"></i> alert-circle-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alert-circle"></i> alert-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alert-octagon"></i> alert-octagon
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alert-polygon"></i> alert-polygon
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alert-triangle"></i> alert-triangle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-help-outline"></i> help-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-help"></i> help
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-info-outline"></i> info-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-info"></i> info
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-notifications-active"></i>
notifications-active
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-notifications-add"></i> notifications-add
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-notifications-none"></i> notifications-none
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-notifications-off"></i> notifications-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-notifications-paused"></i>
notifications-paused
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-notifications"></i> notifications
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Person</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-add"></i> account-add
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-box-mail"></i> account-box-mail
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-box-o"></i> account-box-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-box-phone"></i> account-box-phone
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-box"></i> account-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-calendar"></i> account-calendar
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-circle"></i> account-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account-o"></i> account-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-account"></i> account
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-accounts-add"></i> accounts-add
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-accounts-alt"></i> accounts-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-accounts-list-alt"></i> accounts-list-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-accounts-list"></i> accounts-list
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-accounts-outline"></i> accounts-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-accounts"></i> accounts
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-face"></i> face
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-female"></i> female
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-male-alt"></i> male-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-male-female"></i> male-female
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-male"></i> male
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mood-bad"></i> mood-bad
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mood"></i> mood
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-run"></i> run
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-walk"></i> walk
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>File</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-box"></i> cloud-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-circle"></i> cloud-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-done"></i> cloud-done
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-download"></i> cloud-download
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-off"></i> cloud-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-outline-alt"></i> cloud-outline-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-outline"></i> cloud-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud-upload"></i> cloud-upload
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-cloud"></i> cloud
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-download"></i> download
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-file-plus"></i> file-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-file-text"></i> file-text
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-file"></i> file
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-folder-outline"></i> folder-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-folder-person"></i> folder-person
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-folder-star-alt"></i> folder-star-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-folder-star"></i> folder-star
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-folder"></i> folder
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gif"></i> gif
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-upload"></i> upload
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Editor</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-all"></i> border-all
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-bottom"></i> border-bottom
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-clear"></i> border-clear
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-color"></i> border-color
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-horizontal"></i> border-horizontal
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-inner"></i> border-inner
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-left"></i> border-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-outer"></i> border-outer
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-right"></i> border-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-style"></i> border-style
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-top"></i> border-top
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-border-vertical"></i> border-vertical
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-copy"></i> copy
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop"></i> crop
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-align-center"></i>
format-align-center
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-align-justify"></i>
format-align-justify
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-align-left"></i> format-align-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-align-right"></i> format-align-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-bold"></i> format-bold
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-clear-all"></i> format-clear-all
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-clear"></i> format-clear
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-color-fill"></i> format-color-fill
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-color-reset"></i> format-color-reset
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-color-text"></i> format-color-text
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-indent-decrease"></i>
format-indent-decrease
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-indent-increase"></i>
format-indent-increase
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-italic"></i> format-italic
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-line-spacing"></i>
format-line-spacing
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-list-bulleted"></i>
format-list-bulleted
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-list-numbered"></i>
format-list-numbered
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-ltr"></i> format-ltr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-rtl"></i> format-rtl
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-size"></i> format-size
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-strikethrough-s"></i>
format-strikethrough-s
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-strikethrough"></i>
format-strikethrough
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-subject"></i> format-subject
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-underlined"></i> format-underlined
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-valign-bottom"></i>
format-valign-bottom
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-valign-center"></i>
format-valign-center
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-format-valign-top"></i> format-valign-top
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-redo"></i> redo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-select-all"></i> select-all
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-space-bar"></i> space-bar
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-text-format"></i> text-format
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-transform"></i> transform
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-undo"></i> undo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wrap-text"></i> wrap-text
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Comment</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-alert"></i> comment-alert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-alt-text"></i> comment-alt-text
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-alt"></i> comment-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-edit"></i> comment-edit
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-image"></i> comment-image
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-list"></i> comment-list
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-more"></i> comment-more
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-outline"></i> comment-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-text-alt"></i> comment-text-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-text"></i> comment-text
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment-video"></i> comment-video
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comment"></i> comment
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-comments"></i> comments
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Form</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-check-all"></i> check-all
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-check-circle-u"></i> check-circle-u
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-check-circle"></i> check-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-check-square"></i> check-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-check"></i> check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-circle-o"></i> circle-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-circle"></i> circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dot-circle-alt"></i> dot-circle-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dot-circle"></i> dot-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-minus-circle-outline"></i>
minus-circle-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-minus-circle"></i> minus-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-minus-square"></i> minus-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-minus"></i> minus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus-circle-o-duplicate"></i>
plus-circle-o-duplicate
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus-circle-o"></i> plus-circle-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus-circle"></i> plus-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus-square"></i> plus-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus"></i> plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-square-o"></i> square-o
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-star-circle"></i> star-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-star-half"></i> star-half
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-star-outline"></i> star-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-star"></i> star
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Hardware</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bluetooth-connected"></i>
bluetooth-connected
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bluetooth-off"></i> bluetooth-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bluetooth-search"></i> bluetooth-search
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bluetooth-setting"></i> bluetooth-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-bluetooth"></i> bluetooth
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-add"></i> camera-add
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-alt"></i> camera-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-bw"></i> camera-bw
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-front"></i> camera-front
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-mic"></i> camera-mic
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-party-mode"></i> camera-party-mode
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-rear"></i> camera-rear
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-roll"></i> camera-roll
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera-switch"></i> camera-switch
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-camera"></i> camera
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-alert"></i> card-alert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-off"></i> card-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-sd"></i> card-sd
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-card-sim"></i> card-sim
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-desktop-mac"></i> desktop-mac
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-desktop-windows"></i> desktop-windows
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-device-hub"></i> device-hub
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-devices-off"></i> devices-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-devices"></i> devices
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dock"></i> dock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-floppy"></i> floppy
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gamepad"></i> gamepad
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gps-dot"></i> gps-dot
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gps-off"></i> gps-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gps"></i> gps
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-headset-mic"></i> headset-mic
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-headset"></i> headset
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-input-antenna"></i> input-antenna
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-input-composite"></i> input-composite
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-input-hdmi"></i> input-hdmi
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-input-power"></i> input-power
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-input-svideo"></i> input-svideo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-keyboard-hide"></i> keyboard-hide
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-keyboard"></i> keyboard
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-laptop-chromebook"></i> laptop-chromebook
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-laptop-mac"></i> laptop-mac
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-laptop"></i> laptop
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mic-off"></i> mic-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mic-outline"></i> mic-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mic-setting"></i> mic-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mic"></i> mic
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-mouse"></i> mouse
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-network-alert"></i> network-alert
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-network-locked"></i> network-locked
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-network-off"></i> network-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-network-outline"></i> network-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-network-setting"></i> network-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-network"></i> network
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-bluetooth"></i> phone-bluetooth
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-end"></i> phone-end
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-forwarded"></i> phone-forwarded
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-in-talk"></i> phone-in-talk
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-locked"></i> phone-locked
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-missed"></i> phone-missed
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-msg"></i> phone-msg
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-paused"></i> phone-paused
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-ring"></i> phone-ring
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-setting"></i> phone-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone-sip"></i> phone-sip
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-phone"></i> phone
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-portable-wifi-changes"></i>
portable-wifi-changes
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-portable-wifi-off"></i> portable-wifi-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-portable-wifi"></i> portable-wifi
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-radio"></i> radio
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-reader"></i> reader
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-remote-control-alt"></i> remote-control-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-remote-control"></i> remote-control
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-router"></i> router
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-scanner"></i> scanner
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-android"></i> smartphone-android
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-download"></i>
smartphone-download
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-erase"></i> smartphone-erase
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-info"></i> smartphone-info
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-iphone"></i> smartphone-iphone
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-landscape-lock"></i>
smartphone-landscape-lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-landscape"></i>
smartphone-landscape
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-lock"></i> smartphone-lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-portrait-lock"></i>
smartphone-portrait-lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-ring"></i> smartphone-ring
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-setting"></i> smartphone-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone-setup"></i> smartphone-setup
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-smartphone"></i> smartphone
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-speaker"></i> speaker
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tablet-android"></i> tablet-android
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tablet-mac"></i> tablet-mac
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tablet"></i> tablet
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tv-alt-play"></i> tv-alt-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tv-list"></i> tv-list
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tv-play"></i> tv-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tv"></i> tv
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-usb"></i> usb
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-videocam-off"></i> videocam-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-videocam-switch"></i> videocam-switch
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-videocam"></i> videocam
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-watch"></i> watch
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi-alt-2"></i> wifi-alt-2
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi-alt"></i> wifi-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi-info"></i> wifi-info
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi-lock"></i> wifi-lock
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi-off"></i> wifi-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi-outline"></i> wifi-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wifi"></i> wifi
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Directional</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-left-bottom"></i> arrow-left-bottom
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-left"></i> arrow-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-merge"></i> arrow-merge
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-missed"></i> arrow-missed
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-right-top"></i> arrow-right-top
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-right"></i> arrow-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrow-split"></i> arrow-split
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-arrows"></i> arrows
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-down-circle"></i> caret-down-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-down"></i> caret-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-left-circle"></i> caret-left-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-left"></i> caret-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-right-circle"></i> caret-right-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-right"></i> caret-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-up-circle"></i> caret-up-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-caret-up"></i> caret-up
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-chevron-down"></i> chevron-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-chevron-left"></i> chevron-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-chevron-right"></i> chevron-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-chevron-up"></i> chevron-up
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-forward"></i> forward
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-long-arrow-down"></i> long-arrow-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-long-arrow-left"></i> long-arrow-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-long-arrow-return"></i> long-arrow-return
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-long-arrow-right"></i> long-arrow-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-long-arrow-tab"></i> long-arrow-tab
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-long-arrow-up"></i> long-arrow-up
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-rotate-ccw"></i> rotate-ccw
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-rotate-cw"></i> rotate-cw
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-rotate-left"></i> rotate-left
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-rotate-right"></i> rotate-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-square-down"></i> square-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-square-right"></i> square-right
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-swap-alt"></i> swap-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-swap-vertical-circle"></i>
swap-vertical-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-swap-vertical"></i> swap-vertical
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-swap"></i> swap
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-trending-down"></i> trending-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-trending-flat"></i> trending-flat
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-trending-up"></i> trending-up
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-unfold-less"></i> unfold-less
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-unfold-more"></i> unfold-more
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Map (aliases)</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-bike"></i> zmdi-directions-bike
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-boat"></i> zmdi-directions-boat
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-bus"></i> zmdi-directions-bus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-car"></i> zmdi-directions-car
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-railway"></i> zmdi-directions-railway
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-run"></i> zmdi-directions-run
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-subway"></i> zmdi-directions-subway
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions-walk"></i> zmdi-directions-walk
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-directions"></i> zmdi-directions
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-layers-off"></i> zmdi-layers-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-layers"></i> zmdi-layers
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-activity"></i> zmdi-local-activity
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-airport"></i> zmdi-local-airport
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-atm"></i> zmdi-local-atm
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-bar"></i> zmdi-local-bar
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-cafe"></i> zmdi-local-cafe
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-car-wash"></i> zmdi-local-car-wash
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-convenience-store"></i> zmdi-local-convenience-store
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-dining"></i> zmdi-local-dining
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-drink"></i> zmdi-local-drink
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-florist"></i> zmdi-local-florist
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-gas-station"></i> zmdi-local-gas-station
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-grocery-store"></i> zmdi-local-grocery-store
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-hospital"></i> zmdi-local-hospital
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-hotel"></i> zmdi-local-hotel
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-laundry-service"></i> zmdi-local-laundry-service
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-library"></i> zmdi-local-library
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-mall"></i> zmdi-local-mall
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-movies"></i> zmdi-local-movies
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-offer"></i> zmdi-local-offer
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-parking"></i> zmdi-local-parking
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-pharmacy"></i> zmdi-local-pharmacy
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-phone"></i> zmdi-local-phone
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-pizza"></i> zmdi-local-pizza
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-activity"></i> zmdi-local-activity
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-post-office"></i> zmdi-local-post-office
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-printshop"></i> zmdi-local-printshop
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-see"></i> zmdi-local-see
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-shipping"></i> zmdi-local-shipping
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-store"></i> zmdi-local-store
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-taxi"></i> zmdi-local-taxi
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-local-wc"></i> zmdi-local-wc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-map"></i> zmdi-map
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-my-location"></i> zmdi-my-location
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-nature-people"></i> zmdi-nature-people
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-nature"></i> zmdi-nature
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-navigation"></i> zmdi-navigation
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-account"></i> zmdi-pin-account
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-assistant"></i> zmdi-pin-assistant
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-drop"></i> zmdi-pin-drop
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-help"></i> zmdi-pin-help
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin-off"></i> zmdi-pin-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pin"></i> zmdi-pin
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-traffic"></i> zmdi-traffic
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>View</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-apps"></i> apps
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-grid-off"></i> grid-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-grid"></i> grid
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-agenda"></i> view-agenda
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-array"></i> view-array
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-carousel"></i> view-carousel
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-column"></i> view-column
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-comfy"></i> view-comfy
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-compact"></i> view-compact
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-dashboard"></i> view-dashboard
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-day"></i> view-day
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-headline"></i> view-headline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-list-alt"></i> view-list-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-list"></i> view-list
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-module"></i> view-module
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-quilt"></i> view-quilt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-stream"></i> view-stream
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-subtitles"></i> view-subtitles
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-toc"></i> view-toc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-web"></i> view-web
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-view-week"></i> view-week
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-widgets"></i> widgets
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Date / Time</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alarm-check"></i> alarm-check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alarm-off"></i> alarm-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alarm-plus"></i> alarm-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alarm-snooze"></i> alarm-snooze
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-alarm"></i> alarm
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-calendar-alt"></i> calendar-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-calendar-check"></i> calendar-check
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-calendar-close"></i> calendar-close
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-calendar-note"></i> calendar-note
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-calendar"></i> calendar
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-time-countdown"></i> time-countdown
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-time-interval"></i> time-interval
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-time-restore-setting"></i>
time-restore-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-time-restore"></i> time-restore
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-time"></i> time
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-timer-off"></i> timer-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-timer"></i> timer
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Social</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-android-alt"></i> android-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-android"></i> android
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-apple"></i> apple
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-behance"></i> behance
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-codepen"></i> codepen
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dribbble"></i> dribbble
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-dropbox"></i> dropbox
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-evernote"></i> evernote
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-facebook-box"></i> facebook-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-facebook"></i> facebook
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-github-box"></i> github-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-github"></i> github
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-drive"></i> google-drive
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-earth"></i> google-earth
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-glass"></i> google-glass
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-maps"></i> google-maps
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-pages"></i> google-pages
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-play"></i> google-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-plus-box"></i> google-plus-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-plus"></i> google-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google"></i> google
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-instagram"></i> instagram
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-language-css3"></i> language-css3
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-language-html5"></i> language-html5
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-language-javascript"></i>
language-javascript
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-language-python-alt"></i>
language-python-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-language-python"></i> language-python
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-lastfm"></i> lastfm
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-linkedin-box"></i> linkedin-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-paypal"></i> paypal
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pinterest-box"></i> pinterest-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pocket"></i> pocket
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-polymer"></i> polymer
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-rss"></i> rss
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-share"></i> share
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-stackoverflow"></i> stackoverflow
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-steam-square"></i> steam-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-steam"></i> steam
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-twitter-box"></i> twitter-box
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-twitter"></i> twitter
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-vk"></i> vk
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wikipedia"></i> wikipedia
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-windows"></i> windows
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-500px"></i> 500px
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-8tracks"></i> 8tracks
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-amazon"></i> amazon
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-blogger"></i> blogger
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-delicious"></i> delicious
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-disqus"></i> disqus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flattr"></i> flattr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flickr"></i> flickr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-github-alt"></i> github-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-google-old"></i> google-old
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-linkedin"></i> linkedin
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-odnoklassniki"></i> odnoklassniki
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-outlook"></i> outlook
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-paypal-alt"></i> paypal-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pinterest"></i> pinterest
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-playstation"></i> playstation
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-reddit"></i> reddit
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-skype"></i> skype
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-slideshare"></i> slideshare
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-soundcloud"></i> soundcloud
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tumblr"></i> tumblr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-twitch"></i> twitch
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-vimeo"></i> vimeo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-whatsapp"></i> whatsapp
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-xbox"></i> xbox
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-yahoo"></i> yahoo
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-youtube-play"></i> youtube-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-youtube"></i> youtube
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Image</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-aspect-ratio-alt"></i> aspect-ratio-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-aspect-ratio"></i> aspect-ratio
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-blur-circular"></i> blur-circular
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-blur-linear"></i> blur-linear
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-blur-off"></i> blur-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-blur"></i> blur
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-2"></i> brightness-2
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-3"></i> brightness-3
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-4"></i> brightness-4
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-5"></i> brightness-5
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-6"></i> brightness-6
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-7"></i> brightness-7
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-auto"></i> brightness-auto
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-brightness-setting"></i> brightness-setting
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-broken-image"></i> broken-image
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-center-focus-strong"></i>
center-focus-strong
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-center-focus-weak"></i> center-focus-weak
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-compare"></i> compare
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-16-9"></i> crop-16-9
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-3-2"></i> crop-3-2
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-5-4"></i> crop-5-4
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-7-5"></i> crop-7-5
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-din"></i> crop-din
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-free"></i> crop-free
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-landscape"></i> crop-landscape
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-portrait"></i> crop-portrait
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-crop-square"></i> crop-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-exposure-alt"></i> exposure-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-exposure"></i> exposure
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-filter-b-and-w"></i> filter-b-and-w
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-filter-center-focus"></i>
filter-center-focus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-filter-frames"></i> filter-frames
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-filter-tilt-shift"></i> filter-tilt-shift
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-gradient"></i> gradient
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-grain"></i> grain
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-graphic-eq"></i> graphic-eq
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hdr-off"></i> hdr-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hdr-strong"></i> hdr-strong
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hdr-weak"></i> hdr-weak
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hdr"></i> hdr
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-iridescent"></i> iridescent
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-leak-off"></i> leak-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-leak"></i> leak
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-looks"></i> looks
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-loupe"></i> loupe
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-panorama-horizontal"></i>
panorama-horizontal
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-panorama-vertical"></i> panorama-vertical
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-panorama-wide-angle"></i>
panorama-wide-angle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-photo-size-select-large"></i>
photo-size-select-large
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-photo-size-select-small"></i>
photo-size-select-small
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-picture-in-picture"></i> picture-in-picture
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-slideshow"></i> slideshow
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-texture"></i> texture
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tonality"></i> tonality
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-vignette"></i> vignette
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-wb-auto"></i> wb-auto
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Audio / Video</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-eject-alt"></i> eject-alt
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-eject"></i> eject
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-equalizer"></i> equalizer
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-fast-forward"></i> fast-forward
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-fast-rewind"></i> fast-rewind
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-forward-10"></i> forward-10
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-forward-30"></i> forward-30
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-forward-5"></i> forward-5
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hearing"></i> hearing
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pause-circle-outline"></i>
pause-circle-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pause-circle"></i> pause-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-pause"></i> pause
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-play-circle-outline"></i>
play-circle-outline
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-play-circle"></i> play-circle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-play"></i> play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-playlist-audio"></i> playlist-audio
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-playlist-plus"></i> playlist-plus
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-repeat-one"></i> repeat-one
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-repeat"></i> repeat
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-replay-10"></i> replay-10
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-replay-30"></i> replay-30
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-replay-5"></i> replay-5
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-replay"></i> replay
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-shuffle"></i> shuffle
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-skip-next"></i> skip-next
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-skip-previous"></i> skip-previous
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-stop"></i> stop
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-surround-sound"></i> surround-sound
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tune"></i> tune
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-volume-down"></i> volume-down
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-volume-mute"></i> volume-mute
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-volume-off"></i> volume-off
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-volume-up"></i> volume-up
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Numbers</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-n-1-square"></i> n-1-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-n-2-square"></i> n-2-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-n-3-square"></i> n-3-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-n-4-square"></i> n-4-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-n-5-square"></i> n-5-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-n-6-square"></i> n-6-square
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-neg-1"></i> neg-1
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-neg-2"></i> neg-2
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus-1"></i> plus-1
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-plus-2"></i> plus-2
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sec-10"></i> sec-10
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-sec-3"></i> sec-3
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-zero"></i> zero
</div>
</div>
</div>
<div class="box box-block bg-white">
<h5>Other</h5>
<div class="row icon-area">
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-flat-angled"></i>
airline-seat-flat-angled
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-flat"></i> airline-seat-flat
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-individual-suite"></i> airline-seat-individual-suite
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-legroom-extra"></i> airline-seat-legroom-extra
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-legroom-normal"></i> airline-seat-legroom-normal
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-legroom-reduced"></i> airline-seat-legroom-reduced
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-recline-extra"></i> airline-seat-recline-extra
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airline-seat-recline-normal"></i> airline-seat-recline-normal
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-airplay"></i> airplay
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-closed-caption"></i> closed-caption
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-confirmation-number"></i>
confirmation-number
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-developer-board"></i> developer-board
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-disc-full"></i> disc-full
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-explicit"></i> explicit
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flight-land"></i> flight-land
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flight-takeoff"></i> flight-takeoff
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flip-to-back"></i> flip-to-back
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-flip-to-front"></i> flip-to-front
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-group-work"></i> group-work
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hd"></i> hd
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-hq"></i> hq
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-markunread-mailbox"></i> markunread-mailbox
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-memory"></i> memory
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-nfc"></i> nfc
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-play-for-work"></i> play-for-work
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-power-input"></i> power-input
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-present-to-all"></i> present-to-all
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-satellite"></i> satellite
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-tap-and-play"></i> tap-and-play
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-vibration"></i> vibration
</div>
<div class="col-md-3 col-sm-4 col-xs-6">
<i class="zmdi zmdi-voicemail"></i> voicemail
</div>
</div>
</div>
</div>
</div>
<!-- Footer -->
<footer class="footer">
<div class="container-fluid">
2016 © Neptune
</div>
</footer>
</div>
</div>
<!-- Vendor JS -->
<script type="text/javascript" src="vendor/jquery/jquery-1.12.3.min.js"></script>
<script type="text/javascript" src="vendor/tether/js/tether.min.js"></script>
<script type="text/javascript" src="vendor/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="vendor/detectmobilebrowser/detectmobilebrowser.js"></script>
<script type="text/javascript" src="vendor/jscrollpane/jquery.mousewheel.js"></script>
<script type="text/javascript" src="vendor/jscrollpane/mwheelIntent.js"></script>
<script type="text/javascript" src="vendor/jscrollpane/jquery.jscrollpane.min.js"></script>
<script type="text/javascript" src="vendor/waves/waves.min.js"></script>
<script type="text/javascript" src="vendor/chartist/chartist.min.js"></script>
<script type="text/javascript" src="vendor/switchery/dist/switchery.min.js"></script>
<!-- Neptune JS -->
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="js/demo.js"></script>
</body>
</html>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。