<!DOCTYPE html>
<!--[if IE 8]>			<html class="ie ie8"> <![endif]-->
<!--[if IE 9]>			<html class="ie ie9"> <![endif]-->
<!--[if gt IE 9]><!-->	<html><!--<![endif]-->

<!-- Specific Page Data -->



<!-- End of Data -->

<head>
    <meta charset="utf-8" />
    <title>UI Elements Icons - Responsive Multipurpose Admin Templates | Vendroid</title>
    <meta name="keywords" content="HTML5 Template, CSS3, Mega Menu, Admin Template, Elegant HTML Theme, Vendroid" />
    <meta name="description" content="UI Elements Icons - Responsive Admin HTML Template">
    <meta name="author" content="Venmond">
    
    <!-- Set the viewport width to device width for mobile -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0">    
    
    
    <!-- Fav and touch icons -->
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="img/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="img/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="img/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="img/ico/apple-touch-icon-57-precomposed.png">
    <link rel="shortcut icon" href="img/ico/favicon.png">
    
    
    <!-- CSS -->
       
    <!-- Bootstrap & FontAwesome & Entypo CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <!--[if IE 7]><link type="text/css" rel="stylesheet" href="css/font-awesome-ie7.min.css"><![endif]-->
    <link href="css/font-entypo.css" rel="stylesheet" type="text/css">    

    <!-- Fonts CSS -->
    <link href="css/fonts.css"  rel="stylesheet" type="text/css">
               
    <!-- Plugin CSS -->
    <link href="plugins/jquery-ui/jquery-ui.custom.min.css" rel="stylesheet" type="text/css">    
    <link href="plugins/prettyPhoto-plugin/css/prettyPhoto.css" rel="stylesheet" type="text/css">
    <link href="plugins/isotope/css/isotope.css" rel="stylesheet" type="text/css">
    <link href="plugins/pnotify/css/jquery.pnotify.css" media="screen" rel="stylesheet" type="text/css">    
	<link href="plugins/google-code-prettify/prettify.css" rel="stylesheet" type="text/css"> 
   
         
    <link href="plugins/mCustomScrollbar/jquery.mCustomScrollbar.css" rel="stylesheet" type="text/css">
    <link href="plugins/tagsInput/jquery.tagsinput.css" rel="stylesheet" type="text/css">
    <link href="plugins/bootstrap-switch/bootstrap-switch.css" rel="stylesheet" type="text/css">    
    <link href="plugins/daterangepicker/daterangepicker-bs3.css" rel="stylesheet" type="text/css">    
    <link href="plugins/bootstrap-timepicker/bootstrap-timepicker.min.css" rel="stylesheet" type="text/css">
    <link href="plugins/colorpicker/css/colorpicker.css" rel="stylesheet" type="text/css">            

	<!-- Specific CSS -->
	    
     
    <!-- Theme CSS -->
    <link href="css/theme.min.css" rel="stylesheet" type="text/css">
    <!--[if IE]> <link href="css/ie.css" rel="stylesheet" > <![endif]-->
    <link href="css/chrome.css" rel="stylesheet" type="text/chrome"> <!-- chrome only css -->    


        
    <!-- Responsive CSS -->
        	<link href="css/theme-responsive.min.css" rel="stylesheet" type="text/css"> 

	  
 
 
    <!-- for specific page in style css -->
        
    <!-- for specific page responsive in style css -->
        
    
    <!-- Custom CSS -->
    <link href="custom/custom.css" rel="stylesheet" type="text/css">



    <!-- Head SCRIPTS -->
    <script type="text/javascript" src="js/modernizr.js"></script> 
    <script type="text/javascript" src="js/mobile-detect.min.js"></script> 
    <script type="text/javascript" src="js/mobile-detect-modernizr.js"></script> 
 
    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
      <script type="text/javascript" src="js/html5shiv.js"></script>
      <script type="text/javascript" src="js/respond.min.js"></script>     
    <![endif]-->
    
</head>    

<body id="ui" class="full-layout  nav-right-hide nav-right-start-hide  nav-top-fixed      responsive    clearfix" data-active="ui "  data-smooth-scrolling="1">     
<div class="vd_body">
<!-- Header Start -->
  <header class="header-1" id="header">
      <div class="vd_top-menu-wrapper">
        <div class="container ">
          <div class="vd_top-nav vd_nav-width  ">
          <div class="vd_panel-header">
          	<div class="logo">
            	<a href="index.html"><img alt="logo" src="img/logo.png"></a>
            </div>
            <!-- logo -->
            <div class="vd_panel-menu  hidden-sm hidden-xs" data-intro="<strong>Minimize Left Navigation</strong><br/>Toggle navigation size to medium or small size. You can set both button or one button only. See full option at documentation." data-step=1>
            		                	<span class="nav-medium-button menu" data-toggle="tooltip" data-placement="bottom" data-original-title="Medium Nav Toggle" data-action="nav-left-medium">
	                    <i class="fa fa-bars"></i>
                    </span>
                                		                    
                	<span class="nav-small-button menu" data-toggle="tooltip" data-placement="bottom" data-original-title="Small Nav Toggle" data-action="nav-left-small">
	                    <i class="fa fa-ellipsis-v"></i>
                    </span> 
                                       
            </div>
            <div class="vd_panel-menu left-pos visible-sm visible-xs">
                                 
                        <span class="menu" data-action="toggle-navbar-left">
                            <i class="fa fa-ellipsis-v"></i>
                        </span>  
                            
                              
            </div>
            <div class="vd_panel-menu visible-sm visible-xs">
                	<span class="menu visible-xs" data-action="submenu">
	                    <i class="fa fa-bars"></i>
                    </span>        
                          
                        <span class="menu visible-sm visible-xs" data-action="toggle-navbar-right">
                            <i class="fa fa-comments"></i>
                        </span>                   
                   	 
            </div>                                     
            <!-- vd_panel-menu -->
          </div>
          <!-- vd_panel-header -->
            
          </div>    
          <div class="vd_container">
          	<div class="row">
            	<div class="col-sm-5 col-xs-12">
            		
<div class="vd_menu-search">
  <form id="search-box" method="post" action="#">
    <input type="text" name="search" class="vd_menu-search-text width-60" placeholder="Search">
    <div class="vd_menu-search-category"> <span data-action="click-trigger"> <span class="separator"></span> <span class="text">Category</span> <span class="icon"> <i class="fa fa-caret-down"></i></span> </span>
      <div class="vd_mega-menu-content width-xs-2 center-xs-2 right-sm" data-action="click-target">
        <div class="child-menu">
          <div class="content-list content-menu content">
            <ul class="list-wrapper">
              <li>
                <label>
                  <input type="checkbox" value="all-files">
                  <span>All Files</span></label>
              </li>
              <li>
                <label>
                  <input type="checkbox" value="photos">
                  <span>Photos</span></label>
              </li>
              <li>
                <label>
                  <input type="checkbox" value="illustrations">
                  <span>Illustrations</span></label>
              </li>
              <li>
                <label>
                  <input type="checkbox" value="video">
                  <span>Video</span></label>
              </li>
              <li>
                <label>
                  <input type="checkbox" value="audio">
                  <span>Audio</span></label>
              </li>
              <li>
                <label>
                  <input type="checkbox" value="flash">
                  <span>Flash</span></label>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <span class="vd_menu-search-submit"><i class="fa fa-search"></i> </span>
  </form>
</div>
                </div>
                <div class="col-sm-7 col-xs-12">
              		<div class="vd_mega-menu-wrapper">
                    	<div class="vd_mega-menu pull-right">
            				<ul class="mega-ul">
    <li id="top-menu-1" class="one-icon mega-li"> 
      <a href="index.html" class="mega-link" data-action="click-trigger">
    	<span class="mega-icon"><i class="fa fa-users"></i></span> 
		<span class="badge vd_bg-red">1</span>        
      </a>
      <div class="vd_mega-menu-content width-xs-3 width-sm-4 width-md-5 right-xs left-sm" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   Friend Requests
               <div class="vd_panel-menu">
                     <span data-original-title="Find User" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-search"></i>
                    </span>                 
                     <span data-original-title="Message Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                                                                              
                </div>
           </div>                 
		   <div class="content-grid column-xs-2 column-sm-3 height-xs-4">	
           <div data-rel="scroll">
               <ul class="list-wrapper">
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                         </a>
                        <div class="menu-text"> Gabriella Montagna
                            <div class="menu-info">
                                <div class="menu-date">San Diego</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                                                                   
                                </div>                                
                            </div>
                        </div> 
                     </li>
                    <li class="warning"> 
                    		<a href="#"> 
                    			<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div>  
                            </a>                            
                            <div class="menu-text">  Jonathan Fuzzy
                            	<div class="menu-info">
                                    <div class="menu-date">Seattle</div>                                                                         
                                    <div class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-check"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-times"></i>
                                        </span>                                                                            
                                    </div>                                
                            	</div>                            
                            </div> 
                     </li>    
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 
                         </a>    
                        <div class="menu-text">  Sakura Hinata
                            <div class="menu-info">
                                <div class="menu-date">Hawaii</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                             
                                </div>                                
                            </div>                                                     
                        </div> 
                    </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-4.jpg"></div> 
                         </a>    
                        <div class="menu-text">  Rikudou Sennin
                            <div class="menu-info">
                                <div class="menu-date">Las Vegas</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                              
                                </div>                                
                            </div>                                                        
                        </div> 
                    </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-5.jpg"></div>  
                         </a>   
                        <div class="menu-text">  Kim Kardiosun
                            <div class="menu-info">
                                <div class="menu-date">New York</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                              
                                </div>                                
                            </div>                                                          
                        </div> 
                     </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-6.jpg"></div>
                         </a>    
                        <div class="menu-text">   Brad Pita
                            <div class="menu-info">
                                <div class="menu-date">Seattle</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                              
                                </div>                                
                            </div>                             
                        </div> 
                    </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-7.jpg"></div> 
                         </a>   
                        <div class="menu-text">  Celline Dior
                            <div class="menu-info">
                                <div class="menu-date">Los Angeles</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                             
                                </div>                                
                            </div>                              
                        </div> 
                    </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-8.jpg"></div>
                         </a>    
                        <div class="menu-text">  Goerge Bruno Marz
                            <div class="menu-info">
                                <div class="menu-date">Las Vegas</div>                                                                         
                                <div class="menu-action">
                                    <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Approve" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-check"></i>
                                    </span> 
                                    <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Reject" data-toggle="tooltip" data-placement="bottom">
                                        <i class="fa fa-times"></i>
                                    </span>                                                                              
                                </div>                                
                            </div>                              
                        </div> 
                    </li>                                                                                
                    
               </ul>
               </div>
               <div class="closing text-center" style="">
               		<a href="#">See All Requests <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>
    <li id="top-menu-2" class="one-icon mega-li"> 
      <a href="index.html" class="mega-link" data-action="click-trigger">
    	<span class="mega-icon"><i class="fa fa-envelope"></i></span> 
		<span class="badge vd_bg-red">10</span>        
      </a>
      <div class="vd_mega-menu-content width-xs-3 width-sm-4 width-md-5 width-lg-4 right-xs left-sm" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   Messages
               <div class="vd_panel-menu">
                     <span data-original-title="Message Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                                                                              
                </div>
           </div>                 
		   <div class="content-list content-image">
           	   <div  data-rel="scroll">	
               <ul class="list-wrapper pd-lr-10">
                    <li> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text"> Do you play or follow any sports?
                            	<div class="menu-info">
                                    <span class="menu-date">12 Minutes Ago </span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>
                            </div> 
                    </li>
                    <li class="warning"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div>  
                            <div class="menu-text">  Good job mate !
                            	<div class="menu-info">
                                    <span class="menu-date">1 Hour 20 Minutes Ago </span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Read" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye-slash"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                            
                            </div> 
                     </li>    
                    <li> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 
                            <div class="menu-text">  Just calm down babe, everything will work out.
                            	<div class="menu-info">
                                    <span class="menu-date">12 Days Ago</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                     
                            </div> 
                    </li>                                     
                    <li>
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-4.jpg"></div> 
                            <div class="menu-text">  Euuh so gross....
                            	<div class="menu-info">
                                    <span class="menu-date">19 Days Ago</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                        
                            </div> 
                    </li> 
                    <li> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-5.jpg"></div>  
                            <div class="menu-text">  That's the way.. I like it :D
                            	<div class="menu-info">
                                    <span class="menu-date">20 Days Ago</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                          
                            </div> 
                     </li>
                    <li> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-6.jpg"></div> 
                            <div class="menu-text">  Oooh don't be shy ;P
                            	<div class="menu-info">
                                    <span class="menu-date">21 Days Ago</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                             
                            </div> 
                     </li>                                     
                    <li> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-7.jpg"></div> 
                            <div class="menu-text">  Hello, please call my number..
                            	<div class="menu-info">
                                    <span class="menu-date">24 Days Ago</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                              
                            </div> 
                    </li> 
                    <li> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-8.jpg"></div> 
                            <div class="menu-text">  Don't go anywhere, i will be coming soon
                            	<div class="menu-info">
                                    <span class="menu-date">1 Month 2 days Ago</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Mark as Unread" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-eye"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                              
                            </div> 
                     </li>                                                                                
                    
               </ul>
               </div>
               <div class="closing text-center" style="">
               		<a href="#">See All Notifications <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>  
    <li id="top-menu-3"  class="one-icon mega-li"> 
      <a href="index.html" class="mega-link" data-action="click-trigger">
    	<span class="mega-icon"><i class="fa fa-globe"></i></span> 
		<span class="badge vd_bg-red">51</span>        
      </a>
      <div class="vd_mega-menu-content  width-xs-3 width-sm-4  center-xs-3 left-sm" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           		Notifications 
               <div class="vd_panel-menu">
                     <span data-original-title="Notification Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                   
<!--                     <span class="text-menu" data-original-title="Settings" data-toggle="tooltip" data-placement="bottom">
                        Settings
                    </span> -->                                                              
                </div>
           </div>                 
		   <div class="content-list">	
           	   <div  data-rel="scroll">	
               <ul  class="list-wrapper pd-lr-10">
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_yellow"><i class="fa fa-suitcase"></i></div> 
                            <div class="menu-text"> Someone has give you a surprise 
                            	<div class="menu-info"><span class="menu-date">12 Minutes Ago</span></div>
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_blue"><i class=" fa fa-user"></i></div> 
                            <div class="menu-text">  Change your user profile details
                            	<div class="menu-info"><span class="menu-date">1 Hour 20 Minutes Ago</span></div>
                            </div> 
                    </a> </li>    
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_red"><i class=" fa fa-cogs"></i></div> 
                            <div class="menu-text">  Your setting is updated
                            	<div class="menu-info"><span class="menu-date">12 Days Ago</span></div>                            
                            </div> 
                    </a> </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_green"><i class=" fa fa-book"></i></div> 
                            <div class="menu-text">  Added new article
                            	<div class="menu-info"><span class="menu-date">19 Days Ago</span></div>                              
                            </div> 
                    </a> </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_green"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text">  Change Profile Pic
                            	<div class="menu-info"><span class="menu-date">20 Days Ago</span></div>                              
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_red"><i class=" fa fa-cogs"></i></div> 
                            <div class="menu-text">  Your setting is updated
                            	<div class="menu-info"><span class="menu-date">12 Days Ago</span></div>                            
                            </div> 
                    </a> </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_green"><i class=" fa fa-book"></i></div> 
                            <div class="menu-text">  Added new article
                            	<div class="menu-info"><span class="menu-date">19 Days Ago</span></div>                              
                            </div> 
                    </a> </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_green"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text">  Change Profile Pic
                            	<div class="menu-info"><span class="menu-date">20 Days Ago</span></div>                              
                            </div> 
                    </a> </li>                                                                                
                    
               </ul>
               </div>
               <div class="closing text-center" style="">
               		<a href="#">See All Notifications <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content -->         
    </li>  
     
    <li id="top-menu-profile" class="profile mega-li"> 
        <a href="#" class="mega-link"  data-action="click-trigger"> 
            <span  class="mega-image">
                <img src="img/avatar/avatar.jpg" alt="example image" />               
            </span>
            <span class="mega-name">
                Caroline <i class="fa fa-caret-down fa-fw"></i> 
            </span>
        </a> 
      <div class="vd_mega-menu-content  width-xs-2  left-xs left-sm" data-action="click-target">
        <div class="child-menu"> 
        	<div class="content-list content-menu">
                <ul class="list-wrapper pd-lr-10">
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-user"></i></div> <div class="menu-text">Edit Profile</div> </a> </li>
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-trophy"></i></div> <div class="menu-text">My Achievements</div> </a> </li>
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-envelope"></i></div> <div class="menu-text">Messages</div><div class="menu-badge"><div class="badge vd_bg-red">10</div></div> </a>  </li>
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-tasks
"></i></div> <div class="menu-text"> Tasks</div><div class="menu-badge"><div class="badge vd_bg-red">5</div></div> </a> </li> 
                    <li class="line"></li>                
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-lock
"></i></div> <div class="menu-text">Privacy</div> </a> </li>
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-cogs"></i></div> <div class="menu-text">Settings</div> </a> </li>
                    <li> <a href="#"> <div class="menu-icon"><i class="  fa fa-key"></i></div> <div class="menu-text">Lock</div> </a> </li>
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-sign-out"></i></div>  <div class="menu-text">Sign Out</div> </a> </li>
                    <li class="line"></li>                
                    <li> <a href="#"> <div class="menu-icon"><i class=" fa fa-question-circle"></i></div> <div class="menu-text">Help</div> </a> </li>
                    <li> <a href="#"> <div class="menu-icon"><i class=" glyphicon glyphicon-bullhorn"></i></div> <div class="menu-text">Report a Problem</div> </a> </li>              
                </ul>
            </div> 
        </div> 
      </div>     
  
    </li>               
       
    <li id="top-menu-settings" class="one-big-icon hidden-xs hidden-sm mega-li" data-intro="<strong>Toggle Right Navigation </strong><br/>On smaller device such as tablet or phone you can click on the middle content to close the right or left navigation." data-step=2 data-position="left"> 
    	<a href="#" class="mega-link"  data-action="toggle-navbar-right"> 
           <span class="mega-icon">
                <i class="fa fa-comments"></i> 
            </span> 
<!--            <span  class="mega-image">
                <img src="img/avatar/avatar.jpg" alt="example image" />               
            </span> -->           
			<span class="badge vd_bg-red">8</span>               
        </a>              
       
    </li>
	</ul>
<!-- Head menu search form ends -->                         
                        </div>
                    </div>
                </div>

            </div>
          </div>
        </div>
        <!-- container --> 
      </div>
      <!-- vd_primary-menu-wrapper --> 

  </header>
  <!-- Header Ends --> 
<div class="content"><div class="container">
<div class="vd_navbar vd_nav-width vd_navbar-tabs-menu vd_navbar-left  ">
	<div class="navbar-tabs-menu clearfix">
			<span class="expand-menu" data-action="expand-navbar-tabs-menu">
            	<span class="menu-icon menu-icon-left">
            		<i class="fa fa-ellipsis-h"></i>
                    <span class="badge vd_bg-red">
                        20
                    </span>                    
                </span>
            	<span class="menu-icon menu-icon-right">
            		<i class="fa fa-ellipsis-h"></i>
                    <span class="badge vd_bg-red">
                        20
                    </span>                    
                </span>                
            </span>
            <div class="menu-container">
            	<div class="vd_mega-menu-wrapper">
                	<div class="vd_mega-menu"  data-intro="<strong>Tabs Menu</strong><br/>Can be placed for dropdown menu, tabs, or user profile. Responsive for medium and small size navigation." data-step=3>
        				<ul class="mega-ul">
    <li id="home" class="one-icon mega-li"> 
      <a class="mega-link  vd_bg-blue" href="javascript:void(0);"  data-action="click-trigger">
            <span class="mega-icon">
                <i class="fa fa-cloud"></i>
            </span>
            <span class="badge vd_bg-red">
                10
            </span>
      </a>
      <div class="vd_mega-menu-content width-xs-3 width-sm-5 width-md-6   right-xs " data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   Server Status
               <div class="vd_panel-menu">
                     <span data-original-title="Find Server" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-search"></i>
                    </span>                 
                     <span data-original-title="Message Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                                                                              
                </div>
           </div>                 
		   <div class="content-grid column-md-3 column-sm-2 column-xs-1 height-xs-auto height-sm-4">	
           <div data-rel="scroll">
               <ul class="list-wrapper">
                    <li><a>
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-green badge">Online</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>
                    <li> <a>
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-grey badge">Offline</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>
                    <li> <a>
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-grey badge">Offline</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>
                    <li><a> 
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-grey badge">Offline</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>                                                                                                                         
                    
               </ul>
               </div> <!-- data-rel="scroll" -->
               <div class="closing text-center" style="">
               		<a href="#">See All Requests <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>
    <li id="tabs-menu-tasks" class="one-icon mega-li"> 
        <a class="mega-link  vd_bg-green" href="javascript:void(0);"   data-action="click-trigger">
            <span class="mega-icon">
                <i class="fa fa-tasks"></i>
            </span>
            <span class="badge vd_bg-red">
                8
            </span>
        </a>
      <div class="vd_mega-menu-content width-xs-3 width-sm-4 width-md-5 right-xs" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   You have 8 pending tasks
               <div class="vd_panel-menu">
                     <span data-original-title="Task Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                                                                              
                </div>
           </div>                 
		   <div class="content-list content-image">	
           <div data-rel="scroll">
               <ul class="list-wrapper pd-lr-10">
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_blue"><i class="fa fa-bolt"></i></div> 
                            <div class="menu-text"> Electricity Problem
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:85%" class="progress-bar progress-bar-info"> 
                                        	85%
                                        </div>
                                    </div>                                                                                                    
                            	</div>
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_yellow"><i class="fa fa-code"></i></div>  
                            <div class="menu-text">  Finish coding jquery plugin
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:20%" class="progress-bar progress-bar-danger"> 
                                        	20%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li>    
                    <li> <a> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 
                            <div class="menu-text"> Client: Zoe Project
                            	<div class="menu-info">
                                    <span class="menu-date">Make a call</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Call" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-phone"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                     
                            </div> 
                    </a> </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon"><i class=" fa fa-magic"></i></div>  
                            <div class="menu-text">  Final error check on new templates
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:95%" class="progress-bar progress-bar-success"> 
                                        	95%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_green"><i class=" fa fa-camera"></i></div>  
                            <div class="menu-text">  Update product image
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:50%" class="progress-bar progress-bar-warning"> 
                                        	50%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_blue"><i class="fa fa-bolt"></i></div> 
                            <div class="menu-text"> Electricity Problem
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:85%" class="progress-bar progress-bar-info"> 
                                        	85%
                                        </div>
                                    </div>                                                                                                    
                            	</div>
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_yellow"><i class=" fa fa-code"></i></div>  
                            <div class="menu-text">  Finish coding jquery plugin
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:20%" class="progress-bar progress-bar-danger"> 
                                        	20%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li>    
                    <li> <a> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 
                            <div class="menu-text"> Client: Zoe Project
                            	<div class="menu-info">
                                    <span class="menu-date">Make a call</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Call" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-phone"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                     
                            </div> 
                    </a> </li>                                     
                                                                                                                       
                    
               </ul>
               </div>
               <div class="closing text-center" style="">
               		<a href="#">See All Tasks <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>  
    <li id="test-2" class="one-icon mega-li"> 
        <a class="mega-link vd_bg-yellow " href="javascript:void(0);" data-action="click-trigger">
            <span class="mega-icon">
                <i class="fa fa-pencil"></i>
            </span>
        </a>     
         <div class="vd_mega-menu-content width-xs-3 width-sm-4 width-md-5 center-xs-3 right-sm pd-0" data-action="click-target">
            <div class="child-menu">  

                	<textarea class="no-bd" rows="3" placeholder="What are you doing?" ></textarea>
                    <div class="vd_textarea-menu vd_bg-yellow vd_bd-yellow" >
                    	<ul class="nav nav-pills ">
                        <li class="one-icon">
                            <a data-toggle="tab-post" href="javascript:void(0);">
                                <span class="menu-icon">
                                    <i class="fa fa-user fa-fw"></i>
                                </span>
                            </a>
                        </li>
                        <li class="one-icon">
                            <a data-toggle="tab-post" href="javascript:void(0);">
                                <span class="menu-icon">
                                    <i class="fa fa-camera fa-fw"></i>
                                </span>
                            </a>
                        </li>   
                        <li class="one-icon">
                            <a data-toggle="tab-post" href="javascript:void(0);">
                                <span class="menu-icon">
                                    <i class="fa fa-smile-o fa-fw"></i>
                                </span>
                            </a>
                        </li>  
                        <li class="pull-right">
                            <a data-toggle="tab-post" href="javascript:void(0);" style="border-left:1px solid rgba(255,255,255,.3)">
                                <span class="menu-icon">
                                    <i class="fa fa-check fa-fw"></i>
                                </span>                             
                                <span class="menu-text">
                                	Post
                                </span>                              
                            </a>
                        </li>  
                                                                    
                        </ul>

                </div>
                                          
            </div> <!-- child-menu -->                      
          </div>   <!-- vd_mega-menu-content -->                               
         
    </li>  
    <li id="test" class="one-icon mega-li"> 
        <a class="mega-link vd_bg-red" href="javascript:void(0);" data-action="click-trigger">
            <span class="mega-icon">
                <i class="fa fa-plus"></i>
            </span>
        </a>
        <div class="vd_mega-menu-content  width-xs-2  center-xs-2" data-action="click-target" >
                <div class="child-menu"> 
                    <div class="content-list content-menu">
                        <ul class="list-wrapper pd-lr-10">
                            <li> <a href="#"> <span class="menu-icon"><i class=" fa fa-user"></i></span> <span class="menu-text">Write Article</span> </a> </li>
                            <li> <a href="#"> <span class="menu-icon"><i class=" fa fa-trophy"></i></span> <span class="menu-text">Write News</span> </a> </li>
                            <li> <a href="#"> <span class="menu-icon"><i class=" fa fa-flask"></i></span> <span class="menu-text">Add Product</span> </a>  </li>
                                       
                        </ul>
                    </div> 
                </div> 
           </div>   <!-- vd_mega-menu-content  -->      
    </li>      
</ul>                        	
                    </div>                
                </div>
            </div>                                                   
    </div>
	<div class="navbar-menu clearfix">
        <div class="vd_panel-menu hidden-xs">
            <span data-original-title="Expand All" data-toggle="tooltip" data-placement="bottom" data-action="expand-all" class="menu" data-intro="<strong>Expand Button</strong><br/>To expand all menu on left navigation menu." data-step=4 >
                <i class="fa fa-sort-amount-asc"></i>
            </span>                   
        </div>
    	<h3 class="menu-title hide-nav-medium hide-nav-small">UI Features</h3>
        <div class="vd_menu">
        	 <ul>
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-dashboard"></i></span> 
            <span class="menu-text">Dashboard</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="index.html">
                        <span class="menu-text">Default Dashboard</span>  
                    </a>
                </li>              
                <li>
                    <a href="index-ecommerce.html">
                        <span class="menu-text">E-Commerce Dashboard</span>  
                    </a>
                </li> 
                <li>
                    <a href="index-analytics.html">
                        <span class="menu-text">Analytics Dashboard</span>  
                    </a>
                </li> 
                <li>
                    <a href="index-blogging.html">
                        <span class="menu-text">Blogging Dashboard</span>  
                    </a>
                </li>  
                <li>
                    <a href="index-event-management.html">
                        <span class="menu-text">Event Management Dashboard</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>
                    </a>
                </li>                                                                                                  
            </ul>   
      	</div>
    </li>  
 	<li>
    	<a href="templates/email.html">
        	<span class="menu-icon"><i class="fa fa-envelope"></i></span> 
            <span class="menu-text">Email</span>  
            <span class="menu-badge"><span class="badge vd_bg-red">78</span></span>
       	</a> 
    </li>       
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="icon-palette"> </i></span> 
            <span class="menu-text">Skin Playground</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>  
                <li>
                    <a href="skin-clean-minimalist.html">
                        <span class="menu-text">Clean Minimalist Nav</span>  
                    </a>
                </li> 
                <li>
                    <a href="skin-nav-medium-profile-dark.html">
                        <span class="menu-text">Dark Medium Navbar</span>  
						<span class="menu-badge"><span class="badge vd_bg-red">Hot</span></span>                                    
                    </a>
                </li>                                                                                               
            </ul>   
      	</div>
    </li> 
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon entypo-icon"><i class="icon-bookmark"> </i></span> 
            <span class="menu-text">Starting Layouts</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>  
                <li>
                    <a href="layouts-simple.html">
                        <span class="menu-text">Layout Simple</span>  
                    </a>
                </li> 
                <li>
                    <a href="layouts-simple-medium-profile.html">
                        <span class="menu-text">Layout Simple Medium Profile</span>                                      
                    </a>
                </li>                                
                <li>
                    <a href="layouts-double-sidenav.html">
                        <span class="menu-text">Layout Double SideNav</span>                                      
                    </a>
                </li> 
                <li>
                    <a href="layouts-hide-rightnav.html">
                        <span class="menu-text">Layout Hide RightNav</span>  
                    </a>
                </li>
                <li>
                    <a href="layouts-medium-no-header.html">
                        <span class="menu-text">Layout Medium No Header</span>                                      
                    </a>
                </li>                
                <li>
                    <a href="layouts-right-nav.html">
                        <span class="menu-text">Layout RightNav</span>  
                    </a>
                </li>  
                <li>
                    <a href="layouts-menu-tab.html">
                        <span class="menu-text">Layout Menu Tab</span>  
                    </a>
                </li>   
                <li>
                    <a href="layouts-without-subtitle.html">
                        <span class="menu-text">Layout Without Subtitle</span>  
                    </a>
                </li>                
                <li>
                    <a href="layouts-middle.html">
                        <span class="menu-text">Layout Middle</span>  
                    </a>
                </li>                
                <li>
                    <a href="layouts-boxed.html">
                        <span class="menu-text">Layout Boxed</span>  
                    </a>
                </li> 
                <li>
                    <a href="layouts-full-no-responsive.html">
                        <span class="menu-text">Layout Full No Responsive</span>  
                    </a>
                </li>
                <li>
                    <a href="layouts-middle-no-responsive.html">
                        <span class="menu-text">Layout Middle No Responsive</span>  
                    </a>
                </li>
                <li>
                    <a href="layouts-boxed-no-responsive.html">
                    	<span class="menu-text">Boxed No Responsive</span>  
                    </a>
                </li> 
                <li>
                    <a href="layouts-boxed-custom-width-no-responsive.html">
                    	<span class="menu-text">Boxed Custom Width No Responsive</span>  
                    </a>
                </li>                                               
                <li>
                    <a href="layouts-fixed-nav.html">
                        <span class="menu-text">Layout Fixed Nav</span>  
                    </a>
                </li>
                <li>
                    <a href="layouts-no-header-fixed-nav.html">
                        <span class="menu-text">No Header Fixed Nav</span>  
                    </a>
                </li>                                                                                                                                                                                                               
            </ul>   
      	</div>
    </li>               
    <li>
    	<a href="javascript:void(0);"   data-action="click-trigger">
            <span class="menu-icon"><i class="fa fa-sitemap"> </i></span>
            <span class="menu-text">Nav Variations</span>
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>            
        </a>
      	<div class="child-menu"   data-action="click-target">
            <ul class="clearfix">
                <li> 
                	<a href="javascript:" data-action="click-trigger"> 
                    	<span class="menu-text">Side Navigation</span> 
            			<span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
                    </a> 
                    <div class="child-menu"   data-action="click-target">
                        <ul class="clearfix">
                            <li> <a href="nav-side-large-menu-tab.html"> 
                            		<span class="menu-text">Large Menu Tab</span> 
                                 </a>   
                            </li>
                            <li> <a href="nav-side-large-tabs-tab.html"> 
                            		<span class="menu-text">Large Tabs Tab</span> 
                                 </a>   
                            </li>
                            <li> <a href="nav-side-large-profile-tab.html"> 
                            		<span class="menu-text">Large Profile Tab</span> 
                                 </a>   
                            </li>
                            <li> <a href="nav-side-large-no-tab.html"> 
                            		<span class="menu-text">Large No Tab</span> 
                                 </a>   
                            </li> 
                            <li> <a href="nav-side-large-chat-content.html"> 
                            		<span class="menu-text">Large Chat Content</span> 
                                 </a>   
                            </li>
                            <li> <a href="nav-side-large-email.html"> 
                            		<span class="menu-text">Large Email</span> 
                                 </a>   
                            </li>                                                                                   
                            <li> <a href="nav-side-medium-menu-tab.html"> 
                            		<span class="menu-text">Medium Menu Tab </span>
                                 </a>                                     
                            </li>                            
                            <li> <a href="nav-side-medium-tabs-tab.html"> 
                            		<span class="menu-text">Medium Tabs Tab</span>
                                 </a>                                     
                            </li>
                            <li> <a href="nav-side-medium-profile-tab.html"> 
                            		<span class="menu-text">Medium Profile Tab </span>
									<span class="menu-badge"><span class="badge vd_bg-red">HOT</span></span>     
                                 </a> 
                            </li>
                            <li> <a href="nav-side-medium-no-tab.html"> 
                            		<span class="menu-text">Medium No Tab </span>  
                                 </a> 
                            </li>                            
                            <li> <a href="nav-side-small-menu-tab.html"> 
                            		<span class="menu-text">Small Menu Tab</span>
                             	  </a> 
                            </li>
                            <li> <a href="nav-side-small-tabs-tab.html"> 
                            		<span class="menu-text">Small Tabs Tab</span>
                             	 </a> 
                            </li>
                            <li> <a href="nav-side-small-profile-tab.html"> 
                            		<span class="menu-text">Small Profile Tab</span>
                            	</a> 
                            </li>
                            <li> <a href="nav-side-small-no-tab.html"> 
                            		<span class="menu-text">Small No Tab</span>
                            	</a> 
                            </li>                            
                        </ul>
                    </div>               
                </li>
                <li> 
                	<a href="javascript:" data-action="click-trigger"> 
                    	<span class="menu-text">Top Navigation</span> 
            			<span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
                    </a> 
                    <div class="child-menu"   data-action="click-target">
                        <ul class="clearfix">
                            <li> <a href="nav-top-search.html">Search </a> </li>
                            <li> <a href="nav-top-menu.html">Mega Menu </a> </li>
                            <li> <a href="nav-top-clean-style.html"> Clean Style </a> </li>                            
                        </ul>
                    </div>              
                </li>
                <li> 
                	<a href="javascript:" data-action="click-trigger"> 
                    	<span class="menu-text">Bottom Navigation</span> 
            			<span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
                    </a> 
                    <div class="child-menu"   data-action="click-target">
                        <ul class="clearfix">
                            <li> <a href="nav-bottom-widget.html"> Chat Widget </a> </li>
                            <li> <a href="nav-bottom-clean-menu.html"> Clean With Menu </a> </li>
                            <li> <a href="nav-bottom-clean-center.html"> Clean Center Text </a> </li>
                        </ul>
                    </div>               
                </li>                                 
            </ul>
      	</div>
    </li>
    <li>
    	<a href="templates/functions-index.html">
        	<span class="menu-icon"><i class="fa fa-code"></i></span> 
            <span class="menu-text">Custom Functions</span>  
            <span class="menu-badge"><span class="badge vd_bg-yellow"><i class="fa fa-star"></i></span></span>
       	</a>
    </li>    
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-th-list"></i></span> 
            <span class="menu-text">Forms</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="templates/forms-elements.html">
                        <span class="menu-text">Form Elements</span>  
                    </a>
                </li>              
                <li>
                    <a href="templates/forms-layouts.html">
                        <span class="menu-text">Form Layouts</span>  
                    </a>
                </li>                
                <li>
                    <a href="templates/forms-wizard.html">
                        <span class="menu-text">Form Wizard</span>  
                    </a>
                </li> 
                <li>
                    <a href="templates/forms-validation.html">
                        <span class="menu-text">Form Validation</span>  
                    </a>
                </li>                   
                <li>
                    <a href="templates/forms-sliders.html">
                        <span class="menu-text">Form Slider</span>  
                    </a>
                </li>                 
                <li>
                    <a href="templates/forms-multiple-file-upload.html">
                        <span class="menu-text">Form Multiple File Upload</span>  
                    </a>
                </li>                                                                                      
                <li>
                    <a href="templates/forms-inline-editing.html">
                        <span class="menu-text">Form Inline Editing</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>
                    </a>
                </li>                 
            </ul>   
      	</div>
    </li>  
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon entypo-icon"><i class="icon-tools"></i></span> 
            <span class="menu-text">UI Elements</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="ui-panels.html">
                        <span class="menu-text">Panels</span>  
                    </a>
                </li>    
                <li>
                    <a href="ui-panels-draggable.html">
                        <span class="menu-text">Panels Draggable</span>  
                    </a>
                </li>                              
                <li>
                    <a href="ui-buttons.html">
                        <span class="menu-text">Buttons</span>  
                    </a>
                </li>                
                <li>
                    <a href="ui-typography.html">
                        <span class="menu-text">Typography</span>  
                    </a>
                </li> 
                <li>
                    <a href="ui-icons.html">
                        <span class="menu-text">Icons</span>  
                    </a>
                </li>  
                <li>
                    <a href="ui-tabs-accordion.html">
                        <span class="menu-text">Tabs and Accordion</span>  
                    </a>
                </li>
                <li>
                    <a href="ui-alert-notifications.html">
                        <span class="menu-text">Alert and Notifications</span>  
                    </a>
                </li>                
                <li>
                    <a href="ui-pricing-tables.html">
                        <span class="menu-text">Pricing Tables</span>  
                    </a>
                </li>                                                                                                                                                                              
            </ul>   
      	</div>
    </li>        
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-table"></i></span> 
            <span class="menu-text">List &amp; Tables</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="listtables-tables-variation.html">
                        <span class="menu-text">Tables Variation</span>  
                    </a>
                </li>              
                <li>
                    <a href="listtables-data-tables.html">
                        <span class="menu-text">Data Tables</span>  
                    </a>
                </li> 
                <li>
                    <a href="listtables-small-list.html">
                        <span class="menu-text">Small List</span>  
                    </a>
                </li>
                <li>
                    <a href="listtables-medium-list.html">
                        <span class="menu-text">Medium List</span>  
                    </a>
                </li>   
                <li>
                    <a href="listtables-blog-small-list.html">
                        <span class="menu-text">Blog Small List</span>  
                    </a>
                </li>
                <li>
                    <a href="listtables-blog-large-list.html">
                        <span class="menu-text">Blog Large List</span>  
                    </a>
                </li>                
                <li>
                    <a href="listtables-grid-list.html">
                        <span class="menu-text">Grid List</span>  
                    </a>
                </li>                                                                                                                                                
            </ul>   
      	</div>
    </li>
        <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-signal"></i></span> 
            <span class="menu-text">Charts</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="templates/charts-morris.html">
                        <span class="menu-text">Morris Chart</span>  
                    </a>
                </li>              
                <li>
                    <a href="templates/charts-flot.html">
                        <span class="menu-text">Flot Chart</span>  
                    </a>                
                </li>                                                                                 
                <li>
                    <a href="templates/charts-sparkline.html">
                        <span class="menu-text">Sparkline Chart</span>  
                    </a>
                </li>                 
            </ul>   
      	</div>
    </li>
        <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-map-marker"></i></span> 
            <span class="menu-text">Maps</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="maps-vector.html">
                        <span class="menu-text">Vector Map</span>  
                    </a>
                </li>              
                <li>
                    <a href="maps-google.html">
                        <span class="menu-text">Google Map</span>  
                    </a>                
                </li>                                                                                                 
            </ul>   
      	</div>
    </li> 
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-picture-o"></i></span> 
            <span class="menu-text">Gallery</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="templates/gallery-page.html">
                        <span class="menu-text">Gallery Page</span>  
                    </a>
                </li>   
                <li>
                    <a href="templates/gallery-masonry.html">
                        <span class="menu-text">Gallery Masonry</span>  
                    </a>
                </li>      
                <li>
                    <a href="templates/gallery-text-filter.html">
                        <span class="menu-text">Gallery Text Filter</span>  
                        <span class="menu-badge"><span class="badge vd_bg-red">HOT</span></span>                           
                    </a>
                </li>                                    
            </ul>   
      	</div>
    </li>         
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon entypo-icon"><i class="icon-newspaper"></i></span> 
            <span class="menu-text">Extra Pages</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="pages-custom-product.html">
                        <span class="menu-text">Custom Product Form</span>
                        <span class="menu-badge"><span class="badge vd_bg-red">HOT</span></span>     
                    </a>
                </li> 
                <li>
                    <a href="pages-essay.html">
                        <span class="menu-text">Essay Form</span>  
                    </a>
                </li> 
                <li>
                    <a href="pages-invoice.html">
                        <span class="menu-text">Invoice</span>  
                    </a>
                </li>                 
                <li>
                    <a href="pages-user-profile-form.html">
                        <span class="menu-text">User Profiles Form</span>  
                    </a>
                </li>  
                <li>
                    <a href="pages-user-profile.html">
                        <span class="menu-text">User Profiles Page</span>  
                    </a>
                </li>  
                <li>
                    <a href="pages-timeline.html">
                        <span class="menu-text">Timeline</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>                        
                    </a>
                </li>  
                <li>
                    <a href="pages-calendar.html">
                        <span class="menu-text">Calendar</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>                        
                    </a>
                </li>    
                <li>
                    <a href="pages-ecommerce-products.html">
                        <span class="menu-text">Ecommerce Products List</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>                        
                    </a>
                </li>  
                <li>
                    <a href="pages-ecommerce-product-add.html">
                        <span class="menu-text">Ecommerce Product add</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>                        
                    </a>
                </li>                                                                                                                                                      
                <li>
                    <a href="pages-login.html">
                        <span class="menu-text">Login Page</span>  
                    </a>
                </li>
                <li>
                    <a href="pages-forget-password.html">
                        <span class="menu-text">Forget Password Page</span>  
                    </a>
                </li>                
                <li>
                    <a href="pages-register.html">
                        <span class="menu-text">Register Page</span>  
                    </a>
                </li>  
                <li>
                    <a href="pages-logout.html">
                        <span class="menu-text">Log Out Page</span>  
                    </a>
                </li> 
                <li>
                    <a href="pages-lockscreen.html">
                        <span class="menu-text">Lock Screen</span>  
                        <span class="menu-badge"><span class="badge vd_bg-yellow">NEW</span></span>                        
                    </a>
                </li>                                              
                <li>
                    <a href="pages-404-error.html">
                        <span class="menu-text">404 Error</span>  
                    </a>
                </li>
                <li>
                    <a href="pages-500-error.html">
                        <span class="menu-text">500 Error</span>  
                    </a>
                </li>
                                                                                                                              
            </ul>   
      	</div>
    </li>  
    <li>
    	<a href="javascript:void(0);" data-action="click-trigger">
        	<span class="menu-icon"><i class="fa fa-desktop"></i></span> 
            <span class="menu-text">Front End</span>  
            <span class="menu-badge"><span class="badge vd_bg-black-30"><i class="fa fa-angle-down"></i></span></span>            
       	</a>
     	<div class="child-menu"  data-action="click-target">
            <ul>
                <li>
                    <a href="templates/front-1.html">
                        <span class="menu-text">Flat Theme</span>  
                    </a>
                </li> 
                <li>
                    <a href="templates/front-2.html">
                        <span class="menu-text">Layer Slider</span>  
                    </a>
                </li>
                <li>
                    <a href="templates/front-blog.html">
                        <span class="menu-text">Front Blog</span>  
                    </a>
                </li>     
                <li>
                    <a href="templates/front-blog-content.html">
                        <span class="menu-text">Front Blog Content</span>  
                    </a>
                </li>                                                                                                                       
            </ul>   
      	</div>        
    </li>  
    <li>
    	<a href="http://themeforest.net/item/vendroid-super-flexible-multipurpose-admin-theme/7717536?ref=Venmond">
        	<span class="menu-icon"><i class="fa fa-shopping-cart"></i></span> 
            <span class="menu-text">Buy This Theme</span>  
            <span class="menu-badge"><span class="badge vd_bg-red"><i class="fa fa-exclamation"></i></span></span>
       	</a>
    </li>   
                 
</ul>
<!-- Head menu search form ends -->         </div>             
    </div>
    <div class="navbar-spacing clearfix">
    </div>
    <div class="vd_menu vd_navbar-bottom-widget">
        <ul>
            <li>
                <a href="pages-logout.html">
                    <span class="menu-icon"><i class="fa fa-sign-out"></i></span>          
                    <span class="menu-text">Logout</span>             
                </a>
                
            </li>
        </ul>
    </div>     
</div><div class="vd_navbar vd_nav-width vd_navbar-chat vd_bg-black-80 vd_navbar-right   ">
	<div class="navbar-tabs-menu clearfix">
			<span class="expand-menu" data-action="expand-navbar-tabs-menu">
            	<span class="menu-icon menu-icon-left">
            		<i class="fa fa-ellipsis-h"></i>
                    <span class="badge vd_bg-red">
                        20
                    </span>                    
                </span>
            	<span class="menu-icon menu-icon-right">
            		<i class="fa fa-ellipsis-h"></i>
                    <span class="badge vd_bg-red">
                        20
                    </span>                    
                </span>                
            </span>  
            <div class="menu-container">               
        		 <div class="navbar-search-wrapper">
    <div class="navbar-search vd_bg-black-30">
        <span class="append-icon"><i class="fa fa-search"></i></span>
        <input type="text" placeholder="Search" class="vd_menu-search-text no-bg no-bd vd_white width-70" name="search">
        <div class="pull-right search-config">                                
            <a  data-toggle="dropdown" href="javascript:void(0);" class="dropdown-toggle" ><span class="prepend-icon vd_grey"><i class="fa fa-cog"></i></span></a>
            <ul role="menu" class="dropdown-menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li class="divider"></li>
                <li><a href="#">Separated link</a></li>
              </ul>                                    
        </div>
    </div>
</div>  
            </div>        
                                                 
    </div>
	<div class="navbar-menu clearfix">
    	<div class="content-list content-image content-chat">
            <ul class="list-wrapper no-bd-btm pd-lr-10">
                <li class="group-heading vd_bg-black-20">FAVORITE</li>
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar.jpg" alt="example image"></div> 
                            <div class="menu-text">Jessylin
                                <div class="menu-info">
                                    <span class="menu-date">Administrator </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                    </a>
                </li>
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-2.jpg" alt="example image"></div> 
                            <div class="menu-text">Rodney Mc.Cardo
                                <div class="menu-info">
                                    <span class="menu-date">Designer </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="badge status vd_bg-grey">&nbsp;</span></div> 
                    </a>
                </li>
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-3.jpg" alt="example image"></div> 
                            <div class="menu-text">Theresia Minoque
                                <div class="menu-info">
                                    <span class="menu-date">Engineering </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                    </a>
                </li>
                <li class="group-heading vd_bg-black-20">FRIENDS</li>                                                                                                                                 
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-4.jpg" alt="example image"></div> 
                            <div class="menu-text">Greg Grog
                                <div class="menu-info">
                                    <span class="menu-date">Developer </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="badge status vd_bg-grey">&nbsp;</span></div> 
                    </a>
                </li> 
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-5.jpg" alt="example image"></div> 
                            <div class="menu-text">Stefanie Imburgh
                                <div class="menu-info">
                                    <span class="menu-date">Dancer</span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="vd_grey font-sm"><i class="fa fa-mobile"></i></span></div> 
                    </a>
                </li> 
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-6.jpg" alt="example image"></div> 
                            <div class="menu-text">Matt Demon
                                <div class="menu-info">
                                    <span class="menu-date">Musician </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="vd_grey font-sm"><i class="fa fa-mobile"></i></span></div> 
                    </a>
                </li>
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-7.jpg" alt="example image"></div> 
                            <div class="menu-text">Jeniffer Anastasia
                                <div class="menu-info">
                                    <span class="menu-date">Senior Developer </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                    </a>
                </li>                    
                <li>  
                    <a href="#"> 
                            <div class="menu-icon"><img src="img/avatar/avatar-8.jpg" alt="example image"></div> 
                            <div class="menu-text">Daniel Dreamon
                                <div class="menu-info">
                                    <span class="menu-date">Sales Executive </span>                                                         
                                </div>
                            </div>
                            <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                    </a>
                </li> 

            </ul>
        </div>

            
    </div>
    <div class="navbar-spacing clearfix">
    </div>
</div>



<!-- Middle Content Start -->
<div class="vd_content-wrapper">
    <div class="vd_container">
        <div class="vd_content clearfix">
        	<div class="vd_head-section clearfix">
                <div class="vd_panel-header">            
                    <ul class="breadcrumb">
                      <li><a href="index.html">Home</a> </li>
                      <li><a href="ui-panels.html">UI</a> </li>                                             
                      <li class="active">Icons</li>
                    </ul>
    
                    <div class="vd_panel-menu hidden-sm hidden-xs" data-intro="<strong>Expand Control</strong><br/>To expand content page horizontally, vertically, or Both. If you just need one button just simply remove the other button code." data-step=5  data-position="left">
    <div data-action="remove-navbar" data-original-title="Remove Navigation Bar Toggle" data-toggle="tooltip" data-placement="bottom" class="remove-navbar-button menu"> <i class="fa fa-arrows-h"></i> </div>
      <div data-action="remove-header" data-original-title="Remove Top Menu Toggle" data-toggle="tooltip" data-placement="bottom" class="remove-header-button menu"> <i class="fa fa-arrows-v"></i> </div>
      <div data-action="fullscreen" data-original-title="Remove Navigation Bar and Top Menu Toggle" data-toggle="tooltip" data-placement="bottom" class="fullscreen-button menu"> <i class="glyphicon glyphicon-fullscreen"></i> </div>
      
</div>
   
                </div>                            
            </div>
            <div class="vd_title-section clearfix">
            	<div class="vd_panel-header">
                    <h1>Icons</h1>
                    <small class="subtitle">Font Aweseome, glyphicon, &amp; entypo icon</small>
                </div>
            </div>                
            <div class="vd_content-section example-icon clearfix">       
				<div class="row">
                	<div class="col-sm-12">	
                        <div class="panel widget panel-bd-left light-widget">
                            <div class="panel-body">
                                <h2 class="mgtp-20">Font Awesome <span class="font-semibold">Icons</span></h2>
                                <p>Vendroid using the latest version of the most popular icon font: <strong>Font Awesome</strong> with more than 300 icons available.<br/>
                                  For more information go to <a class="vd_readmore" href="http://fortawesome.github.io/Font-Awesome/" rel="nofollow">Font Awesome Site</a>.</p>
<div id="new">
  <h3 class="page-header">71 New Icons in 4.1</h3>
  

  <div class="row fontawesome-icon-list">
    

    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw  fa-automobile"></i> fa-automobile <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bank"></i> fa-bank <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-behance"></i> fa-behance</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-behance-square"></i> fa-behance-square</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bomb"></i> fa-bomb</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-building"></i> fa-building</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cab"></i> fa-cab <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-car"></i> fa-car</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-child"></i> fa-child</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-circle-o-notch"></i> fa-circle-o-notch</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-circle-thin"></i> fa-circle-thin</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-codepen"></i> fa-codepen</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cube"></i> fa-cube</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cubes"></i> fa-cubes</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-database"></i> fa-database</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-delicious"></i> fa-delicious</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-deviantart"></i> fa-deviantart</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-digg"></i> fa-digg</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-drupal"></i> fa-drupal</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-empire"></i> fa-empire</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-envelope-square"></i> fa-envelope-square</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-fax"></i> fa-fax</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-archive-o"></i> fa-file-archive-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-audio-o"></i> fa-file-audio-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-code-o"></i> fa-file-code-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-excel-o"></i> fa-file-excel-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-image-o"></i> fa-file-image-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-movie-o"></i> fa-file-movie-o <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-pdf-o"></i> fa-file-pdf-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-photo-o"></i> fa-file-photo-o <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-picture-o"></i> fa-file-picture-o <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-powerpoint-o"></i> fa-file-powerpoint-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-sound-o"></i> fa-file-sound-o <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-video-o"></i> fa-file-video-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-word-o"></i> fa-file-word-o</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-zip-o"></i> fa-file-zip-o <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ge"></i> fa-ge <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-git"></i> fa-git</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-git-square"></i> fa-git-square</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-google"></i> fa-google</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-graduation-cap"></i> fa-graduation-cap</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hacker-news"></i> fa-hacker-news</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-header"></i> fa-header</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-history"></i> fa-history</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-institution"></i> fa-institution <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-joomla"></i> fa-joomla</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-jsfiddle"></i> fa-jsfiddle</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-language"></i> fa-language</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-life-bouy"></i> fa-life-bouy <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-life-ring"></i> fa-life-ring</a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-life-saver"></i> fa-life-saver <span class="text-muted">(alias)</span></a></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-mortar-board"></i> fa-mortar-board <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-openid"></i> fa-openid</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-paper-plane"></i> fa-paper-plane</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-paper-plane-o"></i> fa-paper-plane-o</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-paragraph"></i> fa-paragraph</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-paw"></i> fa-paw</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pied-piper"></i> fa-pied-piper</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pied-piper-alt"></i> fa-pied-piper-alt</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pied-piper-square"></i> fa-pied-piper-square <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-qq"></i> fa-qq</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ra"></i> fa-ra <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rebel"></i> fa-rebel</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-recycle"></i> fa-recycle</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-reddit"></i> fa-reddit</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-reddit-square"></i> fa-reddit-square</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-send"></i> fa-send <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-send-o"></i> fa-send-o <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-share-alt"></i> fa-share-alt</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-share-alt-square"></i> fa-share-alt-square</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-slack"></i> fa-slack</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sliders"></i> fa-sliders</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-soundcloud"></i> fa-soundcloud</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-space-shuttle"></i> fa-space-shuttle</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-spoon"></i> fa-spoon</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-spotify"></i> fa-spotify</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-steam"></i> fa-steam</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-steam-square"></i> fa-steam-square</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-stumbleupon"></i> fa-stumbleupon</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-stumbleupon-circle"></i> fa-stumbleupon-circle</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-support"></i> fa-support <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-taxi"></i> fa-taxi</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tencent-weibo"></i> fa-tencent-weibo</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tree"></i> fa-tree</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-university"></i> fa-university</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-vine"></i> fa-vine</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-wechat"></i> fa-wechat <span class="text-muted">(alias)</span></div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-weixin"></i> fa-weixin</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-wordpress"></i> fa-wordpress</div>
    
      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-yahoo"></i> fa-yahoo</div>
    
  </div>

</div>                                  
                                  <section id="web-application">
                                  <h3 class="page-header">Web Application Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-adjust"></i> fa-adjust</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-anchor"></i> fa-anchor</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-archive"></i> fa-archive</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows"></i> fa-arrows</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows-h"></i> fa-arrows-h</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows-v"></i> fa-arrows-v</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-asterisk"></i> fa-asterisk</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ban"></i> fa-ban</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bar-chart-o"></i> fa-bar-chart-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-barcode"></i> fa-barcode</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bars"></i> fa-bars</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-beer"></i> fa-beer</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bell"></i> fa-bell</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bell-o"></i> fa-bell-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bolt"></i> fa-bolt</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-book"></i> fa-book</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bookmark"></i> fa-bookmark</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bookmark-o"></i> fa-bookmark-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-briefcase"></i> fa-briefcase</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bug"></i> fa-bug</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-building-o"></i> fa-building-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bullhorn"></i> fa-bullhorn</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bullseye"></i> fa-bullseye</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-calendar"></i> fa-calendar</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-calendar-o"></i> fa-calendar-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-camera"></i> fa-camera</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-camera-retro"></i> fa-camera-retro</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-down"></i> fa-caret-square-o-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-left"></i> fa-caret-square-o-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-right"></i> fa-caret-square-o-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-up"></i> fa-caret-square-o-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-certificate"></i> fa-certificate</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check"></i> fa-check</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check-circle"></i> fa-check-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check-circle-o"></i> fa-check-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check-square"></i> fa-check-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check-square-o"></i> fa-check-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-circle"></i> fa-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-circle-o"></i> fa-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-clock-o"></i> fa-clock-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cloud"></i> fa-cloud</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cloud-download"></i> fa-cloud-download</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cloud-upload"></i> fa-cloud-upload</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-code"></i> fa-code</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-code-fork"></i> fa-code-fork</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-coffee"></i> fa-coffee</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cog"></i> fa-cog</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cogs"></i> fa-cogs</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-comment"></i> fa-comment</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-comment-o"></i> fa-comment-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-comments"></i> fa-comments</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-comments-o"></i> fa-comments-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-compass"></i> fa-compass</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-credit-card"></i> fa-credit-card</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-crop"></i> fa-crop</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-crosshairs"></i> fa-crosshairs</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cutlery"></i> fa-cutlery</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dashboard"></i> fa-dashboard <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-desktop"></i> fa-desktop</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dot-circle-o"></i> fa-dot-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-download"></i> fa-download</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-edit"></i> fa-edit <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ellipsis-h"></i> fa-ellipsis-h</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ellipsis-v"></i> fa-ellipsis-v</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-envelope"></i> fa-envelope</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-envelope-o"></i> fa-envelope-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-eraser"></i> fa-eraser</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-exchange"></i> fa-exchange</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-exclamation"></i> fa-exclamation</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-exclamation-circle"></i> fa-exclamation-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-exclamation-triangle"></i> fa-exclamation-triangle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-external-link"></i> fa-external-link</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-external-link-square"></i> fa-external-link-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-eye"></i> fa-eye</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-eye-slash"></i> fa-eye-slash</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-female"></i> fa-female</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-fighter-jet"></i> fa-fighter-jet</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-film"></i> fa-film</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-filter"></i> fa-filter</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-fire"></i> fa-fire</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-fire-extinguisher"></i> fa-fire-extinguisher</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-flag"></i> fa-flag</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-flag-checkered"></i> fa-flag-checkered</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-flag-o"></i> fa-flag-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-flash"></i> fa-flash <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-flask"></i> fa-flask</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-folder"></i> fa-folder</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-folder-o"></i> fa-folder-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-folder-open"></i> fa-folder-open</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-folder-open-o"></i> fa-folder-open-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-frown-o"></i> fa-frown-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gamepad"></i> fa-gamepad</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gavel"></i> fa-gavel</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gear"></i> fa-gear <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gears"></i> fa-gears <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gift"></i> fa-gift</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-glass"></i> fa-glass</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-globe"></i> fa-globe</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-group"></i> fa-group <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hdd-o"></i> fa-hdd-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-headphones"></i> fa-headphones</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-heart"></i> fa-heart</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-heart-o"></i> fa-heart-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-home"></i> fa-home</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-inbox"></i> fa-inbox</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-info"></i> fa-info</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-info-circle"></i> fa-info-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-key"></i> fa-key</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-keyboard-o"></i> fa-keyboard-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-laptop"></i> fa-laptop</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-leaf"></i> fa-leaf</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-legal"></i> fa-legal <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-lemon-o"></i> fa-lemon-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-level-down"></i> fa-level-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-level-up"></i> fa-level-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-lightbulb-o"></i> fa-lightbulb-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-location-arrow"></i> fa-location-arrow</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-lock"></i> fa-lock</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-magic"></i> fa-magic</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-magnet"></i> fa-magnet</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-mail-forward"></i> fa-mail-forward <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-mail-reply"></i> fa-mail-reply <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-mail-reply-all"></i> fa-mail-reply-all</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-male"></i> fa-male</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-map-marker"></i> fa-map-marker</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-meh-o"></i> fa-meh-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-microphone"></i> fa-microphone</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-microphone-slash"></i> fa-microphone-slash</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-minus"></i> fa-minus</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-minus-circle"></i> fa-minus-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-minus-square"></i> fa-minus-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-minus-square-o"></i> fa-minus-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-mobile"></i> fa-mobile</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-mobile-phone"></i> fa-mobile-phone <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-money"></i> fa-money</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-moon-o"></i> fa-moon-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-music"></i> fa-music</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pencil"></i> fa-pencil</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pencil-square"></i> fa-pencil-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pencil-square-o"></i> fa-pencil-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-phone"></i> fa-phone</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-phone-square"></i> fa-phone-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-picture-o"></i> fa-picture-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plane"></i> fa-plane</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus"></i> fa-plus</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus-circle"></i> fa-plus-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus-square"></i> fa-plus-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus-square-o"></i> fa-plus-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-power-off"></i> fa-power-off</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-print"></i> fa-print</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-puzzle-piece"></i> fa-puzzle-piece</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-qrcode"></i> fa-qrcode</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-question"></i> fa-question</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-question-circle"></i> fa-question-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-quote-left"></i> fa-quote-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-quote-right"></i> fa-quote-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-random"></i> fa-random</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-refresh"></i> fa-refresh</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-reply"></i> fa-reply</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-reply-all"></i> fa-reply-all</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-retweet"></i> fa-retweet</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-road"></i> fa-road</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rocket"></i> fa-rocket</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rss"></i> fa-rss</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rss-square"></i> fa-rss-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-search"></i> fa-search</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-search-minus"></i> fa-search-minus</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-search-plus"></i> fa-search-plus</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-share"></i> fa-share</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-share-square"></i> fa-share-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-share-square-o"></i> fa-share-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-shield"></i> fa-shield</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-shopping-cart"></i> fa-shopping-cart</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sign-in"></i> fa-sign-in</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sign-out"></i> fa-sign-out</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-signal"></i> fa-signal</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sitemap"></i> fa-sitemap</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-smile-o"></i> fa-smile-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort"></i> fa-sort</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-alpha-asc"></i> fa-sort-alpha-asc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-alpha-desc"></i> fa-sort-alpha-desc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-amount-asc"></i> fa-sort-amount-asc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-amount-desc"></i> fa-sort-amount-desc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-asc"></i> fa-sort-asc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-desc"></i> fa-sort-desc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-down"></i> fa-sort-down <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-numeric-asc"></i> fa-sort-numeric-asc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-numeric-desc"></i> fa-sort-numeric-desc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sort-up"></i> fa-sort-up <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-spinner"></i> fa-spinner</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-square"></i> fa-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-square-o"></i> fa-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-star"></i> fa-star</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-star-half"></i> fa-star-half</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-star-half-empty"></i> fa-star-half-empty <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-star-half-full"></i> fa-star-half-full <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-star-half-o"></i> fa-star-half-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-star-o"></i> fa-star-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-subscript"></i> fa-subscript</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-suitcase"></i> fa-suitcase</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-sun-o"></i> fa-sun-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-superscript"></i> fa-superscript</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tablet"></i> fa-tablet</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tachometer"></i> fa-tachometer</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tag"></i> fa-tag</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tags"></i> fa-tags</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tasks"></i> fa-tasks</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-terminal"></i> fa-terminal</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-thumb-tack"></i> fa-thumb-tack</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-thumbs-down"></i> fa-thumbs-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-thumbs-o-down"></i> fa-thumbs-o-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-thumbs-o-up"></i> fa-thumbs-o-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-thumbs-up"></i> fa-thumbs-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ticket"></i> fa-ticket</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-times"></i> fa-times</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-times-circle"></i> fa-times-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-times-circle-o"></i> fa-times-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tint"></i> fa-tint</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-down"></i> fa-toggle-down <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-left"></i> fa-toggle-left <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-right"></i> fa-toggle-right <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-up"></i> fa-toggle-up <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-trash-o"></i> fa-trash-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-trophy"></i> fa-trophy</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-truck"></i> fa-truck</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-umbrella"></i> fa-umbrella</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-unlock"></i> fa-unlock</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-unlock-alt"></i> fa-unlock-alt</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-unsorted"></i> fa-unsorted <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-upload"></i> fa-upload</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-user"></i> fa-user</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-users"></i> fa-users</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-video-camera"></i> fa-video-camera</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-volume-down"></i> fa-volume-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-volume-off"></i> fa-volume-off</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-volume-up"></i> fa-volume-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-warning"></i> fa-warning <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-wheelchair"></i> fa-wheelchair</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-wrench"></i> fa-wrench</div>
                                    
                                  </div>
                                
                                </section>
                                
                                  <section id="form-control">
                                  <h3 class="page-header">Form Control Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check-square"></i> fa-check-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-check-square-o"></i> fa-check-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-circle"></i> fa-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-circle-o"></i> fa-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dot-circle-o"></i> fa-dot-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-minus-square"></i> fa-minus-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-minus-square-o"></i> fa-minus-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus-square"></i> fa-plus-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus-square-o"></i> fa-plus-square-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-square"></i> fa-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-square-o"></i> fa-square-o</div>
                                    
                                  </div>
                                </section>
                                
                                  <section id="currency">
                                  <h3 class="page-header">Currency Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bitcoin"></i> fa-bitcoin <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-btc"></i> fa-btc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cny"></i> fa-cny <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dollar"></i> fa-dollar <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-eur"></i> fa-eur</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-euro"></i> fa-euro <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gbp"></i> fa-gbp</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-inr"></i> fa-inr</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-jpy"></i> fa-jpy</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-krw"></i> fa-krw</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-money"></i> fa-money</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rmb"></i> fa-rmb <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rouble"></i> fa-rouble <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rub"></i> fa-rub</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ruble"></i> fa-ruble <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rupee"></i> fa-rupee <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-try"></i> fa-try</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-turkish-lira"></i> fa-turkish-lira <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-usd"></i> fa-usd</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-won"></i> fa-won <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-yen"></i> fa-yen <span class="text-muted">(alias)</span></div>
                                    
                                  </div>
                                
                                </section>
                                
                                  <section id="text-editor">
                                  <h3 class="page-header">Text Editor Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-align-center"></i> fa-align-center</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-align-justify"></i> fa-align-justify</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-align-left"></i> fa-align-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-align-right"></i> fa-align-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bold"></i> fa-bold</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chain"></i> fa-chain <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chain-broken"></i> fa-chain-broken</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-clipboard"></i> fa-clipboard</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-columns"></i> fa-columns</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-copy"></i> fa-copy <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-cut"></i> fa-cut <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dedent"></i> fa-dedent <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-eraser"></i> fa-eraser</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file"></i> fa-file</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-o"></i> fa-file-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-text"></i> fa-file-text</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-file-text-o"></i> fa-file-text-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-files-o"></i> fa-files-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-floppy-o"></i> fa-floppy-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-font"></i> fa-font</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-indent"></i> fa-indent</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-italic"></i> fa-italic</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-link"></i> fa-link</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-list"></i> fa-list</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-list-alt"></i> fa-list-alt</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-list-ol"></i> fa-list-ol</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-list-ul"></i> fa-list-ul</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-outdent"></i> fa-outdent</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-paperclip"></i> fa-paperclip</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-paste"></i> fa-paste <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-repeat"></i> fa-repeat</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rotate-left"></i> fa-rotate-left <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-rotate-right"></i> fa-rotate-right <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-save"></i> fa-save <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-scissors"></i> fa-scissors</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-strikethrough"></i> fa-strikethrough</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-table"></i> fa-table</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-text-height"></i> fa-text-height</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-text-width"></i> fa-text-width</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-th"></i> fa-th</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-th-large"></i> fa-th-large</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-th-list"></i> fa-th-list</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-underline"></i> fa-underline</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-undo"></i> fa-undo</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-unlink"></i> fa-unlink <span class="text-muted">(alias)</span></div>
                                    
                                  </div>
                                
                                </section>
                                
                                  <section id="directional">
                                  <h3 class="page-header">Directional Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-double-down"></i> fa-angle-double-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-double-left"></i> fa-angle-double-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-double-right"></i> fa-angle-double-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-double-up"></i> fa-angle-double-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-down"></i> fa-angle-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-left"></i> fa-angle-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-right"></i> fa-angle-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-angle-up"></i> fa-angle-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-down"></i> fa-arrow-circle-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-left"></i> fa-arrow-circle-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-o-down"></i> fa-arrow-circle-o-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-o-left"></i> fa-arrow-circle-o-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-o-right"></i> fa-arrow-circle-o-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-o-up"></i> fa-arrow-circle-o-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-right"></i> fa-arrow-circle-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-circle-up"></i> fa-arrow-circle-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-down"></i> fa-arrow-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-left"></i> fa-arrow-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-right"></i> fa-arrow-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrow-up"></i> fa-arrow-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows"></i> fa-arrows</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows-alt"></i> fa-arrows-alt</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows-h"></i> fa-arrows-h</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows-v"></i> fa-arrows-v</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-down"></i> fa-caret-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-left"></i> fa-caret-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-right"></i> fa-caret-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-down"></i> fa-caret-square-o-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-left"></i> fa-caret-square-o-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-right"></i> fa-caret-square-o-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-square-o-up"></i> fa-caret-square-o-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-caret-up"></i> fa-caret-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-circle-down"></i> fa-chevron-circle-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-circle-left"></i> fa-chevron-circle-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-circle-right"></i> fa-chevron-circle-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-circle-up"></i> fa-chevron-circle-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-down"></i> fa-chevron-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-left"></i> fa-chevron-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-right"></i> fa-chevron-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-chevron-up"></i> fa-chevron-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hand-o-down"></i> fa-hand-o-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hand-o-left"></i> fa-hand-o-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hand-o-right"></i> fa-hand-o-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hand-o-up"></i> fa-hand-o-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-long-arrow-down"></i> fa-long-arrow-down</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-long-arrow-left"></i> fa-long-arrow-left</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-long-arrow-right"></i> fa-long-arrow-right</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-long-arrow-up"></i> fa-long-arrow-up</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-down"></i> fa-toggle-down <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-left"></i> fa-toggle-left <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-right"></i> fa-toggle-right <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-toggle-up"></i> fa-toggle-up <span class="text-muted">(alias)</span></div>
                                    
                                  </div>
                                
                                </section>
                                
                                  <section id="video-player">
                                  <h3 class="page-header">Video Player Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-arrows-alt"></i> fa-arrows-alt</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-backward"></i> fa-backward</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-compress"></i> fa-compress</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-eject"></i> fa-eject</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-expand"></i> fa-expand</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-fast-backward"></i> fa-fast-backward</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-fast-forward"></i> fa-fast-forward</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-forward"></i> fa-forward</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pause"></i> fa-pause</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-play"></i> fa-play</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-play-circle"></i> fa-play-circle</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-play-circle-o"></i> fa-play-circle-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-step-backward"></i> fa-step-backward</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-step-forward"></i> fa-step-forward</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-stop"></i> fa-stop</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-youtube-play"></i> fa-youtube-play</div>
                                    
                                  </div>
                                
                                </section>
                                
                                  <section id="brand">
                                  <h3 class="page-header">Brand Icons</h3>
                                
                                  <div class="alert alert-success">
                                    <ul class="margin-bottom-none padding-left-lg">
                                  <li>All brand icons are trademarks of their respective owners.</li>
                                  <li>The use of these trademarks does not indicate endorsement of the trademark holder by Font Awesome, nor vice versa.</li>
                                </ul>
                                
                                  </div>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-adn"></i> fa-adn</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-android"></i> fa-android</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-apple"></i> fa-apple</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bitbucket"></i> fa-bitbucket</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bitbucket-square"></i> fa-bitbucket-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-bitcoin"></i> fa-bitcoin <span class="text-muted">(alias)</span></div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-btc"></i> fa-btc</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-css3"></i> fa-css3</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dribbble"></i> fa-dribbble</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-dropbox"></i> fa-dropbox</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-facebook"></i> fa-facebook</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-facebook-square"></i> fa-facebook-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-flickr"></i> fa-flickr</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-foursquare"></i> fa-foursquare</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-github"></i> fa-github</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-github-alt"></i> fa-github-alt</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-github-square"></i> fa-github-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-gittip"></i> fa-gittip</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-google-plus"></i> fa-google-plus</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-google-plus-square"></i> fa-google-plus-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-html5"></i> fa-html5</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-instagram"></i> fa-instagram</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-linkedin"></i> fa-linkedin</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-linkedin-square"></i> fa-linkedin-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-linux"></i> fa-linux</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-maxcdn"></i> fa-maxcdn</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pagelines"></i> fa-pagelines</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pinterest"></i> fa-pinterest</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-pinterest-square"></i> fa-pinterest-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-renren"></i> fa-renren</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-skype"></i> fa-skype</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-stack-exchange"></i> fa-stack-exchange</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-stack-overflow"></i> fa-stack-overflow</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-trello"></i> fa-trello</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tumblr"></i> fa-tumblr</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-tumblr-square"></i> fa-tumblr-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-twitter"></i> fa-twitter</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-twitter-square"></i> fa-twitter-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-vimeo-square"></i> fa-vimeo-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-vk"></i> fa-vk</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-weibo"></i> fa-weibo</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-windows"></i> fa-windows</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-xing"></i> fa-xing</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-xing-square"></i> fa-xing-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-youtube"></i> fa-youtube</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-youtube-play"></i> fa-youtube-play</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-youtube-square"></i> fa-youtube-square</div>
                                    
                                  </div>
                                </section>
                                
                                  <section id="medical">
                                  <h3 class="page-header">Medical Icons</h3>
                                
                                  <div class="row fontawesome-icon-list">
                                    
                                
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-ambulance"></i> fa-ambulance</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-h-square"></i> fa-h-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-hospital-o"></i> fa-hospital-o</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-medkit"></i> fa-medkit</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-plus-square"></i> fa-plus-square</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-stethoscope"></i> fa-stethoscope</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-user-md"></i> fa-user-md</div>
                                    
                                      <div class="fa-hover col-md-3 col-sm-4"><i class="append-icon fa fa-fw fa-wheelchair"></i> fa-wheelchair</div>
                                    
                                  </div>
                                
                                </section>

                            </div>
                        </div> <!-- Panel Widget -->                                      
                    </div>
                       
                </div>  <!-- row --> 
        
				<div class="row">
                	<div class="col-sm-12">	
                        <div class="panel widget panel-bd-left light-widget">

                            <div class="panel-body">
	        					<h2 class="mgtp-20">Glyphicon</h2> 
        						<p>Vendroid also using the latest version of the most popular icon font: <strong>Glyphicon</strong> with more than 300 icons available.<br/>
          						For more information go to <a class="vd_readmore" href="http://fortawesome.github.io/Font-Awesome/" rel="nofollow">twitter bootstrap</a>.</p>                                
                                <section id="glyphicon">
                                    <div class="row the-icons">
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-adjust"></i> glyphicon glyphicon-adjust</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-align-center"></i> glyphicon glyphicon-align-center</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-align-justify"></i> glyphicon glyphicon-align-justify</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-align-left"></i> glyphicon glyphicon-align-left</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-align-right"></i> glyphicon glyphicon-align-right</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-arrow-down"></i> glyphicon glyphicon-arrow-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-arrow-left"></i> glyphicon glyphicon-arrow-left</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-arrow-right"></i> glyphicon glyphicon-arrow-right</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-arrow-up"></i> glyphicon glyphicon-arrow-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-asterisk"></i> glyphicon glyphicon-asterisk</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-backward"></i> glyphicon glyphicon-backward</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-ban-circle"></i> glyphicon glyphicon-ban-circle</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-barcode"></i> glyphicon glyphicon-barcode</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-bell"></i> glyphicon glyphicon-bell</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-bold"></i> glyphicon glyphicon-bold</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-book"></i> glyphicon glyphicon-book</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-bookmark"></i> glyphicon glyphicon-bookmark</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-briefcase"></i> glyphicon glyphicon-briefcase</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-bullhorn"></i> glyphicon glyphicon-bullhorn</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-calendar"></i> glyphicon glyphicon-calendar</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-camera"></i> glyphicon glyphicon-camera</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-certificate"></i> glyphicon glyphicon-certificate</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-check"></i> glyphicon glyphicon-check</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-chevron-down"></i> glyphicon glyphicon-chevron-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-chevron-left"></i> glyphicon glyphicon-chevron-left</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-chevron-right"></i> glyphicon glyphicon-chevron-right</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-chevron-up"></i> glyphicon glyphicon-chevron-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-circle-arrow-down"></i> glyphicon glyphicon-circle-arrow-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-circle-arrow-left"></i> glyphicon glyphicon-circle-arrow-left</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-circle-arrow-right"></i> glyphicon glyphicon-circle-arrow-right</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-circle-arrow-up"></i> glyphicon glyphicon-circle-arrow-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-cloud"></i> glyphicon glyphicon-cloud</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-cloud-download"></i> glyphicon glyphicon-cloud-download</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-cloud-upload"></i> glyphicon glyphicon-cloud-upload</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-cog"></i> glyphicon glyphicon-cog</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-collapse-down"></i> glyphicon glyphicon-collapse-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-collapse-up"></i> glyphicon glyphicon-collapse-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-comment"></i> glyphicon glyphicon-comment</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-compressed"></i> glyphicon glyphicon-compressed</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-copyright-mark"></i> glyphicon glyphicon-copyright-mark</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-credit-card"></i> glyphicon glyphicon-credit-card</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-cutlery"></i> glyphicon glyphicon-cutlery</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-dashboard"></i> glyphicon glyphicon-dashboard</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-download"></i> glyphicon glyphicon-download</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-download-alt"></i> glyphicon glyphicon-download-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-earphone"></i> glyphicon glyphicon-earphone</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-edit"></i> glyphicon glyphicon-edit</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-eject"></i> glyphicon glyphicon-eject</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-envelope"></i> glyphicon glyphicon-envelope</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-euro"></i> glyphicon glyphicon-euro</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-exclamation-sign"></i> glyphicon glyphicon-exclamation-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-expand"></i> glyphicon glyphicon-expand</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-export"></i> glyphicon glyphicon-export</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-eye-close"></i> glyphicon glyphicon-eye-close</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-eye-open"></i> glyphicon glyphicon-eye-open</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-facetime-video"></i> glyphicon glyphicon-facetime-video</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-fast-backward"></i> glyphicon glyphicon-fast-backward</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-fast-forward"></i> glyphicon glyphicon-fast-forward</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-file"></i> glyphicon glyphicon-file</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-film"></i> glyphicon glyphicon-film</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-filter"></i> glyphicon glyphicon-filter</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-fire"></i> glyphicon glyphicon-fire</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-flag"></i> glyphicon glyphicon-flag</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-flash"></i> glyphicon glyphicon-flash</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-floppy-disk"></i> glyphicon glyphicon-floppy-disk</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-floppy-open"></i> glyphicon glyphicon-floppy-open</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-floppy-remove"></i> glyphicon glyphicon-floppy-remove</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-floppy-save"></i> glyphicon glyphicon-floppy-save</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-floppy-saved"></i> glyphicon glyphicon-floppy-saved</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-folder-close"></i> glyphicon glyphicon-folder-close</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-folder-open"></i> glyphicon glyphicon-folder-open</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-font"></i> glyphicon glyphicon-font</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-forward"></i> glyphicon glyphicon-forward</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-fullscreen"></i> glyphicon glyphicon-fullscreen</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-gbp"></i> glyphicon glyphicon-gbp</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-gift"></i> glyphicon glyphicon-gift</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-glass"></i> glyphicon glyphicon-glass</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-globe"></i> glyphicon glyphicon-globe</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-hand-down"></i> glyphicon glyphicon-hand-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-hand-left"></i> glyphicon glyphicon-hand-left</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-hand-right"></i> glyphicon glyphicon-hand-right</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-hand-up"></i> glyphicon glyphicon-hand-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-hd-video"></i> glyphicon glyphicon-hd-video</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-hdd"></i> glyphicon glyphicon-hdd</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-header"></i> glyphicon glyphicon-header</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-headphones"></i> glyphicon glyphicon-headphones</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-heart"></i> glyphicon glyphicon-heart</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-heart-empty"></i> glyphicon glyphicon-heart-empty</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-home"></i> glyphicon glyphicon-home</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-import"></i> glyphicon glyphicon-import</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-inbox"></i> glyphicon glyphicon-inbox</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-indent-left"></i> glyphicon glyphicon-indent-left</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-indent-right"></i> glyphicon glyphicon-indent-right</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-info-sign"></i> glyphicon glyphicon-info-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-italic"></i> glyphicon glyphicon-italic</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-leaf"></i> glyphicon glyphicon-leaf</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-link"></i> glyphicon glyphicon-link</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-list"></i> glyphicon glyphicon-list</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-list-alt"></i> glyphicon glyphicon-list-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-lock"></i> glyphicon glyphicon-lock</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-log-in"></i> glyphicon glyphicon-log-in</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-log-out"></i> glyphicon glyphicon-log-out</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-magnet"></i> glyphicon glyphicon-magnet</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-map-marker"></i> glyphicon glyphicon-map-marker</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-minus"></i> glyphicon glyphicon-minus</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-minus-sign"></i> glyphicon glyphicon-minus-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-move"></i> glyphicon glyphicon-move</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-music"></i> glyphicon glyphicon-music</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-new-window"></i> glyphicon glyphicon-new-window</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-off"></i> glyphicon glyphicon-off</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-ok"></i> glyphicon glyphicon-ok</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-ok-circle"></i> glyphicon glyphicon-ok-circle</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-ok-sign"></i> glyphicon glyphicon-ok-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-open"></i> glyphicon glyphicon-open</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-paperclip"></i> glyphicon glyphicon-paperclip</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-pause"></i> glyphicon glyphicon-pause</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-pencil"></i> glyphicon glyphicon-pencil</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-phone"></i> glyphicon glyphicon-phone</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-phone-alt"></i> glyphicon glyphicon-phone-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-picture"></i> glyphicon glyphicon-picture</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-plane"></i> glyphicon glyphicon-plane</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-play"></i> glyphicon glyphicon-play</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-play-circle"></i> glyphicon glyphicon-play-circle</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-plus"></i> glyphicon glyphicon-plus</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-plus-sign"></i> glyphicon glyphicon-plus-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-print"></i> glyphicon glyphicon-print</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-pushpin"></i> glyphicon glyphicon-pushpin</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-qrcode"></i> glyphicon glyphicon-qrcode</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-question-sign"></i> glyphicon glyphicon-question-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-random"></i> glyphicon glyphicon-random</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-record"></i> glyphicon glyphicon-record</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-refresh"></i> glyphicon glyphicon-refresh</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-registration-mark"></i> glyphicon glyphicon-registration-mark</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-remove"></i> glyphicon glyphicon-remove</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-remove-circle"></i> glyphicon glyphicon-remove-circle</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-remove-sign"></i> glyphicon glyphicon-remove-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-repeat"></i> glyphicon glyphicon-repeat</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-resize-full"></i> glyphicon glyphicon-resize-full</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-resize-horizontal"></i> glyphicon glyphicon-resize-horizontal</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-resize-small"></i> glyphicon glyphicon-resize-small</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-resize-vertical"></i> glyphicon glyphicon-resize-vertical</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-retweet"></i> glyphicon glyphicon-retweet</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-road"></i> glyphicon glyphicon-road</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-save"></i> glyphicon glyphicon-save</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-saved"></i> glyphicon glyphicon-saved</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-screenshot"></i> glyphicon glyphicon-screenshot</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sd-video"></i> glyphicon glyphicon-sd-video</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-search"></i> glyphicon glyphicon-search</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-send"></i> glyphicon glyphicon-send</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-share"></i> glyphicon glyphicon-share</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-share-alt"></i> glyphicon glyphicon-share-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-shopping-cart"></i> glyphicon glyphicon-shopping-cart</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-signal"></i> glyphicon glyphicon-signal</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort"></i> glyphicon glyphicon-sort</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort-by-alphabet"></i> glyphicon glyphicon-sort-by-alphabet</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort-by-alphabet-alt"></i> glyphicon glyphicon-sort-by-alphabet-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort-by-attributes"></i> glyphicon glyphicon-sort-by-attributes</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort-by-attributes-alt"></i> glyphicon glyphicon-sort-by-attributes-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort-by-order"></i> glyphicon glyphicon-sort-by-order</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sort-by-order-alt"></i> glyphicon glyphicon-sort-by-order-alt</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sound-5-1"></i> glyphicon glyphicon-sound-5-1</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sound-6-1"></i> glyphicon glyphicon-sound-6-1</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sound-7-1"></i> glyphicon glyphicon-sound-7-1</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sound-dolby"></i> glyphicon glyphicon-sound-dolby</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-sound-stereo"></i> glyphicon glyphicon-sound-stereo</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-star"></i> glyphicon glyphicon-star</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-star-empty"></i> glyphicon glyphicon-star-empty</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-stats"></i> glyphicon glyphicon-stats</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-step-backward"></i> glyphicon glyphicon-step-backward</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-step-forward"></i> glyphicon glyphicon-step-forward</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-stop"></i> glyphicon glyphicon-stop</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-subtitles"></i> glyphicon glyphicon-subtitles</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tag"></i> glyphicon glyphicon-tag</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tags"></i> glyphicon glyphicon-tags</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tasks"></i> glyphicon glyphicon-tasks</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-text-height"></i> glyphicon glyphicon-text-height</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-text-width"></i> glyphicon glyphicon-text-width</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-th"></i> glyphicon glyphicon-th</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-th-large"></i> glyphicon glyphicon-th-large</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-th-list"></i> glyphicon glyphicon-th-list</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-thumbs-down"></i> glyphicon glyphicon-thumbs-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-thumbs-up"></i> glyphicon glyphicon-thumbs-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-time"></i> glyphicon glyphicon-time</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tint"></i> glyphicon glyphicon-tint</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tower"></i> glyphicon glyphicon-tower</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-transfer"></i> glyphicon glyphicon-transfer</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-trash"></i> glyphicon glyphicon-trash</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tree-conifer"></i> glyphicon glyphicon-tree-conifer</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-tree-deciduous"></i> glyphicon glyphicon-tree-deciduous</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-unchecked"></i> glyphicon glyphicon-unchecked</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-upload"></i> glyphicon glyphicon-upload</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-usd"></i> glyphicon glyphicon-usd</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-user"></i> glyphicon glyphicon-user</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-volume-down"></i> glyphicon glyphicon-volume-down</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-volume-off"></i> glyphicon glyphicon-volume-off</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-volume-up"></i> glyphicon glyphicon-volume-up</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-warning-sign"></i> glyphicon glyphicon-warning-sign</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-wrench"></i> glyphicon glyphicon-wrench</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-zoom-in"></i> glyphicon glyphicon-zoom-in</div>
                                      <div class="col-md-3 col-sm-4"><i class="append-icon glyphicon glyphicon-zoom-out"></i> glyphicon glyphicon-zoom-out</div>
                                    </div>        
                                </section> 
                                   
                            </div>     
                        </div>
                     </div>
                </div>        
				<div class="row">
                	<div class="col-sm-12">	
                        <div class="panel widget panel-bd-left light-widget">


                            <div class="panel-body">
	        					<h2 class="mgtp-20">Entypo Icons</h2>  
        						<p>Vendroid also use entypo icon for more modern looks of icon.<br/>
          						For more information go to <a class="vd_readmore" href="http://fortawesome.github.io/Font-Awesome/" rel="nofollow">twitter bootstrap</a>.</p>
                                    <div class="row the-icons">
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-phone"></span><span class="mls"> icon-phone</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-mobile"></span><span class="mls"> icon-mobile</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-mouse"></span><span class="mls"> icon-mouse</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-directions"></span><span class="mls"> icon-directions</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-mail"></span><span class="mls"> icon-mail</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-paperplane"></span><span class="mls"> icon-paperplane</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-pencil"></span><span class="mls"> icon-pencil</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-feather"></span><span class="mls"> icon-feather</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-paperclip"></span><span class="mls"> icon-paperclip</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-drawer"></span><span class="mls"> icon-drawer</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-reply"></span><span class="mls"> icon-reply</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-reply-all"></span><span class="mls"> icon-reply-all</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-forward"></span><span class="mls"> icon-forward</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-user"></span><span class="mls"> icon-user</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-users"></span><span class="mls"> icon-users</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-user-add"></span><span class="mls"> icon-user-add</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-vcard"></span><span class="mls"> icon-vcard</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-export"></span><span class="mls"> icon-export</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-location"></span><span class="mls"> icon-location</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-map"></span><span class="mls"> icon-map</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-compass"></span><span class="mls"> icon-compass</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-location2"></span><span class="mls"> icon-location2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-target"></span><span class="mls"> icon-target</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-share"></span><span class="mls"> icon-share</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-sharable"></span><span class="mls"> icon-sharable</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-heart"></span><span class="mls"> icon-heart</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-heart2"></span><span class="mls"> icon-heart2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-star"></span><span class="mls"> icon-star</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-star2"></span><span class="mls"> icon-star2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-thumbs-up"></span><span class="mls"> icon-thumbs-up</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-thumbs-down"></span><span class="mls"> icon-thumbs-down</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-chat"></span><span class="mls"> icon-chat</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-comment"></span><span class="mls"> icon-comment</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-quote"></span><span class="mls"> icon-quote</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-house"></span><span class="mls"> icon-house</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-popup"></span><span class="mls"> icon-popup</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-search"></span><span class="mls"> icon-search</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flashlight"></span><span class="mls"> icon-flashlight</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-printer"></span><span class="mls"> icon-printer</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bell"></span><span class="mls"> icon-bell</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-link"></span><span class="mls"> icon-link</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flag"></span><span class="mls"> icon-flag</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cog"></span><span class="mls"> icon-cog</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-tools"></span><span class="mls"> icon-tools</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-trophy"></span><span class="mls"> icon-trophy</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-tag"></span><span class="mls"> icon-tag</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-camera"></span><span class="mls"> icon-camera</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-megaphone"></span><span class="mls"> icon-megaphone</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-moon"></span><span class="mls"> icon-moon</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-palette"></span><span class="mls"> icon-palette</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-leaf"></span><span class="mls"> icon-leaf</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-music"></span><span class="mls"> icon-music</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-music2"></span><span class="mls"> icon-music2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-new"></span><span class="mls"> icon-new</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-graduation"></span><span class="mls"> icon-graduation</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-book"></span><span class="mls"> icon-book</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-newspaper"></span><span class="mls"> icon-newspaper</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bag"></span><span class="mls"> icon-bag</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-airplane"></span><span class="mls"> icon-airplane</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-lifebuoy"></span><span class="mls"> icon-lifebuoy</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-eye"></span><span class="mls"> icon-eye</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-clock"></span><span class="mls"> icon-clock</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-microphone"></span><span class="mls"> icon-microphone</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-calendar"></span><span class="mls"> icon-calendar</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bolt"></span><span class="mls"> icon-bolt</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-thunder"></span><span class="mls"> icon-thunder</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-droplet"></span><span class="mls"> icon-droplet</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cd"></span><span class="mls"> icon-cd</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-briefcase"></span><span class="mls"> icon-briefcase</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-air"></span><span class="mls"> icon-air</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-hourglass"></span><span class="mls"> icon-hourglass</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-gauge"></span><span class="mls"> icon-gauge</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-language"></span><span class="mls"> icon-language</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-network"></span><span class="mls"> icon-network</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-key"></span><span class="mls"> icon-key</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-battery"></span><span class="mls"> icon-battery</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bucket"></span><span class="mls"> icon-bucket</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-magnet"></span><span class="mls"> icon-magnet</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-drive"></span><span class="mls"> icon-drive</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cup"></span><span class="mls"> icon-cup</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-rocket"></span><span class="mls"> icon-rocket</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-brush"></span><span class="mls"> icon-brush</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-suitcase"></span><span class="mls"> icon-suitcase</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cone"></span><span class="mls"> icon-cone</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-earth"></span><span class="mls"> icon-earth</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-keyboard"></span><span class="mls"> icon-keyboard</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-browser"></span><span class="mls"> icon-browser</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-publish"></span><span class="mls"> icon-publish</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-progress-3"></span><span class="mls"> icon-progress-3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-progress-2"></span><span class="mls"> icon-progress-2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-brogress-1"></span><span class="mls"> icon-brogress-1</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-progress-0"></span><span class="mls"> icon-progress-0</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-sun"></span><span class="mls"> icon-sun</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-sun2"></span><span class="mls"> icon-sun2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-adjust"></span><span class="mls"> icon-adjust</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-code"></span><span class="mls"> icon-code</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-screen"></span><span class="mls"> icon-screen</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-infinity"></span><span class="mls"> icon-infinity</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-light-bulb"></span><span class="mls"> icon-light-bulb</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-credit-card"></span><span class="mls"> icon-credit-card</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-database"></span><span class="mls"> icon-database</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-voicemail"></span><span class="mls"> icon-voicemail</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-clipboard"></span><span class="mls"> icon-clipboard</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cart"></span><span class="mls"> icon-cart</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-box"></span><span class="mls"> icon-box</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-ticket"></span><span class="mls"> icon-ticket</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-rss"></span><span class="mls"> icon-rss</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-signal"></span><span class="mls"> icon-signal</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-thermometer"></span><span class="mls"> icon-thermometer</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-droplets"></span><span class="mls"> icon-droplets</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-uniE66E"></span><span class="mls"> icon-uniE66E</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-statistics"></span><span class="mls"> icon-statistics</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-pie"></span><span class="mls"> icon-pie</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bars"></span><span class="mls"> icon-bars</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-graph"></span><span class="mls"> icon-graph</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-lock"></span><span class="mls"> icon-lock</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-lock-open"></span><span class="mls"> icon-lock-open</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-logout"></span><span class="mls"> icon-logout</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-login"></span><span class="mls"> icon-login</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-checkmark"></span><span class="mls"> icon-checkmark</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cross"></span><span class="mls"> icon-cross</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-minus"></span><span class="mls"> icon-minus</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-plus"></span><span class="mls"> icon-plus</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cross2"></span><span class="mls"> icon-cross2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-minus2"></span><span class="mls"> icon-minus2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-plus2"></span><span class="mls"> icon-plus2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cross3"></span><span class="mls"> icon-cross3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-minus3"></span><span class="mls"> icon-minus3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-plus3"></span><span class="mls"> icon-plus3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-erase"></span><span class="mls"> icon-erase</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-blocked"></span><span class="mls"> icon-blocked</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-info"></span><span class="mls"> icon-info</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-info2"></span><span class="mls"> icon-info2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-question"></span><span class="mls"> icon-question</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-help"></span><span class="mls"> icon-help</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-warning"></span><span class="mls"> icon-warning</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cycle"></span><span class="mls"> icon-cycle</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cw"></span><span class="mls"> icon-cw</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-ccw"></span><span class="mls"> icon-ccw</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-shuffle"></span><span class="mls"> icon-shuffle</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow"></span><span class="mls"> icon-arrow</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow2"></span><span class="mls"> icon-arrow2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-retweet"></span><span class="mls"> icon-retweet</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-loop"></span><span class="mls"> icon-loop</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-history"></span><span class="mls"> icon-history</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-back"></span><span class="mls"> icon-back</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-switch"></span><span class="mls"> icon-switch</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-list"></span><span class="mls"> icon-list</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-add-to-list"></span><span class="mls"> icon-add-to-list</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-layout"></span><span class="mls"> icon-layout</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-list2"></span><span class="mls"> icon-list2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-text"></span><span class="mls"> icon-text</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-text2"></span><span class="mls"> icon-text2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-document"></span><span class="mls"> icon-document</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-docs"></span><span class="mls"> icon-docs</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-landscape"></span><span class="mls"> icon-landscape</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-pictures"></span><span class="mls"> icon-pictures</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-video"></span><span class="mls"> icon-video</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-music3"></span><span class="mls"> icon-music3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-folder"></span><span class="mls"> icon-folder</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-archive"></span><span class="mls"> icon-archive</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-trash"></span><span class="mls"> icon-trash</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-upload"></span><span class="mls"> icon-upload</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-download"></span><span class="mls"> icon-download</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-disk"></span><span class="mls"> icon-disk</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-install"></span><span class="mls"> icon-install</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cloud"></span><span class="mls"> icon-cloud</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-upload2"></span><span class="mls"> icon-upload2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bookmark"></span><span class="mls"> icon-bookmark</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-bookmarks"></span><span class="mls"> icon-bookmarks</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-book2"></span><span class="mls"> icon-book2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-play"></span><span class="mls"> icon-play</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-pause"></span><span class="mls"> icon-pause</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-record"></span><span class="mls"> icon-record</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-stop"></span><span class="mls"> icon-stop</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-next"></span><span class="mls"> icon-next</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-previous"></span><span class="mls"> icon-previous</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-first"></span><span class="mls"> icon-first</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-last"></span><span class="mls"> icon-last</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-resize-enlarge"></span><span class="mls"> icon-resize-enlarge</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-resize-shrink"></span><span class="mls"> icon-resize-shrink</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-volume"></span><span class="mls"> icon-volume</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-sound"></span><span class="mls"> icon-sound</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-mute"></span><span class="mls"> icon-mute</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flow-cascade"></span><span class="mls"> icon-flow-cascade</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flow-branch"></span><span class="mls"> icon-flow-branch</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flow-tree"></span><span class="mls"> icon-flow-tree</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flow-line"></span><span class="mls"> icon-flow-line</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flow-parallel"></span><span class="mls"> icon-flow-parallel</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left"></span><span class="mls"> icon-arrow-left</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down"></span><span class="mls"> icon-arrow-down</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up--upload"></span><span class="mls"> icon-arrow-up--upload</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right"></span><span class="mls"> icon-arrow-right</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left2"></span><span class="mls"> icon-arrow-left2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down2"></span><span class="mls"> icon-arrow-down2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up"></span><span class="mls"> icon-arrow-up</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right2"></span><span class="mls"> icon-arrow-right2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left3"></span><span class="mls"> icon-arrow-left3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down3"></span><span class="mls"> icon-arrow-down3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up2"></span><span class="mls"> icon-arrow-up2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right3"></span><span class="mls"> icon-arrow-right3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left4"></span><span class="mls"> icon-arrow-left4</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down4"></span><span class="mls"> icon-arrow-down4</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up3"></span><span class="mls"> icon-arrow-up3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right4"></span><span class="mls"> icon-arrow-right4</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left5"></span><span class="mls"> icon-arrow-left5</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down5"></span><span class="mls"> icon-arrow-down5</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up4"></span><span class="mls"> icon-arrow-up4</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right5"></span><span class="mls"> icon-arrow-right5</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left6"></span><span class="mls"> icon-arrow-left6</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down6"></span><span class="mls">  icon-arrow-down6</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up5"></span><span class="mls"> icon-arrow-up5</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right6"></span><span class="mls"> icon-arrow-right6</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left7"></span><span class="mls"> icon-arrow-left7</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down7"></span><span class="mls"> icon-arrow-down7</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up6"></span><span class="mls"> icon-arrow-up6</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-uniE6D8"></span><span class="mls"> icon-uniE6D8</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-left8"></span><span class="mls"> icon-arrow-left8</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-down8"></span><span class="mls"> icon-arrow-down8</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-up7"></span><span class="mls"> icon-arrow-up7</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-arrow-right7"></span><span class="mls"> icon-arrow-right7</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-menu"></span><span class="mls"> icon-menu</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-ellipsis"></span><span class="mls"> icon-ellipsis</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-dots"></span><span class="mls"> icon-dots</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-dot"></span><span class="mls"> icon-dot</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc"></span><span class="mls"> icon-cc</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-by"></span><span class="mls"> icon-cc-by</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-nc"></span><span class="mls"> icon-cc-nc</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-nc-eu"></span><span class="mls"> icon-cc-nc-eu</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-nc-jp"></span><span class="mls"> icon-cc-nc-jp</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-sa"></span><span class="mls"> icon-cc-sa</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-nd"></span><span class="mls"> icon-cc-nd</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-pd"></span><span class="mls"> icon-cc-pd</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-zero"></span><span class="mls"> icon-cc-zero</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-share"></span><span class="mls"> icon-cc-share</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-cc-share2"></span><span class="mls"> icon-cc-share2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-daniel-bruce"></span><span class="mls"> icon-daniel-bruce</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-daniel-bruce2"></span><span class="mls"> icon-daniel-bruce2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-github"></span><span class="mls"> icon-github</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-github2"></span><span class="mls"> icon-github2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flickr"></span><span class="mls"> icon-flickr</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flickr2"></span><span class="mls"> icon-flickr2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-vimeo"></span><span class="mls"> icon-vimeo</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-vimeo2"></span><span class="mls"> icon-vimeo2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-twitter"></span><span class="mls"> icon-twitter</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-twitter2"></span><span class="mls"> icon-twitter2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-facebook"></span><span class="mls"> icon-facebook</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-facebook2"></span><span class="mls"> icon-facebook2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-facebook3"></span><span class="mls"> icon-facebook3</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-googleplus"></span><span class="mls"> icon-googleplus</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-googleplus2"></span><span class="mls"> icon-googleplus2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-pinterest"></span><span class="mls"> icon-pinterest</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-pinterest2"></span><span class="mls"> icon-pinterest2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-tumblr"></span><span class="mls"> icon-tumblr</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-tumblr2"></span><span class="mls"> icon-tumblr2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-linkedin"></span><span class="mls"> icon-linkedin</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-linkedin2"></span><span class="mls"> icon-linkedin2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-dribbble"></span><span class="mls"> icon-dribbble</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-dribbble2"></span><span class="mls"> icon-dribbble2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-stumbleupon"></span><span class="mls"> icon-stumbleupon</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-stumbleupon2"></span><span class="mls"> icon-stumbleupon2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-lastfm"></span><span class="mls"> icon-lastfm</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-lastfm2"></span><span class="mls"> icon-lastfm2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-rdio"></span><span class="mls"> icon-rdio</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-rdio2"></span><span class="mls"> icon-rdio2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-spotify"></span><span class="mls"> icon-spotify</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-spotify2"></span><span class="mls"> icon-spotify2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-qq"></span><span class="mls"> icon-qq</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-instagram"></span><span class="mls"> icon-instagram</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-dropbox"></span><span class="mls"> icon-dropbox</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-evernote"></span><span class="mls"> icon-evernote</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-flattr"></span><span class="mls"> icon-flattr</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-skype"></span><span class="mls"> icon-skype</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-skype2"></span><span class="mls"> icon-skype2</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-renren"></span><span class="mls"> icon-renren</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-sina-weibo"></span><span class="mls"> icon-sina-weibo</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-paypal"></span><span class="mls"> icon-paypal</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-picasa"></span><span class="mls"> icon-picasa</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-soundcloud"></span><span class="mls"> icon-soundcloud</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-mixi"></span><span class="mls"> icon-mixi</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-behance"></span><span class="mls"> icon-behance</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-circles"></span><span class="mls"> icon-circles</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-vk"></span><span class="mls"> icon-vk</span></div>
                                      <div class="col-md-3 col-sm-4"><span class="append-icon icon-smashing"></span><span class="mls"> icon-smashing</span></div>
                                                                            
                                    </div>
                            </div>     
                        </div>
                     </div>
                </div>            
                                          
            </div>      
          <!-- .vd_content-section --> 
          
        </div>
        <!-- .vd_content --> 
      </div>
      <!-- .vd_container --> 
    </div>
    <!-- .vd_content-wrapper --> 
    
    <!-- Middle Content End --> 
    
  </div>
  <!-- .container --> 
</div>
<!-- .content -->
  
  
  
<!-- Footer Start -->
  <footer class="footer-1"  id="footer">      
    <div class="vd_bottom ">
        <div class="container">
            <div class="row">
              <div class=" col-xs-12">
                <div class="copyright">
                  	Copyright &copy;2014 Venmond Inc. All Rights Reserved 
                </div>
              </div>
            </div><!-- row -->
        </div><!-- container -->
    </div>
  </footer>
<!-- Footer END -->
  <div class="vd_chat-menu hidden-xs">
      <div class="vd_mega-menu-wrapper">
          <div class="vd_mega-menu">
             <ul class="mega-ul">
    <li class="one-icon mega-li mgl-10"> 
      <a class="mega-link vd_bg-green" href="javascript:void(0);"  data-action="click-trigger">
            <span class="mega-icon">
                <i class="fa fa-cloud"></i>
            </span>
            <span class="badge vd_bg-red">
                10
            </span>
      </a>
      <div class="vd_mega-menu-content width-xs-3 width-sm-5 width-md-6  center-xs-6 open-top" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   Server Status
               <div class="vd_panel-menu">
                     <span data-original-title="Find Server" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-search"></i>
                    </span>                 
                     <span data-original-title="Message Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                                                                              
                </div>
           </div>                 
		   <div class="content-grid column-md-3 column-sm-2 column-xs-1 height-xs-auto height-sm-4">	
           <div data-rel="scroll">
               <ul class="list-wrapper">
                    <li><a>
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-green badge">Online</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>
                    <li> <a>
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-grey badge">Offline</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>
                    <li> <a>
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-grey badge">Offline</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>

                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>
                    <li><a> 
           		            <div class="menu-icon">
                				<i class="fa fa-cloud"></i>
           				    </div>
                            <div class="menu-text"> Venmond.com
                            	<div class="menu-info">
                                    <span class="menu-date vd_bg-grey badge">Offline</span>
                                    <div class="menu-status  text-left">
                                    	<span class="text">Disk Usage</span>
                                        <span class="value pull-right vd_black">4.35/140 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:15%" class="progress-bar progress-bar-info"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                     
                                    <div class="menu-status  text-left">
                                    	<span class="text">BW Usage</span>
                                        <span class="value pull-right vd_black">1600/2500 GB</span>
                                    </div>
                                    <div class="menu-info">
                                        <div class="progress">
                                            <div style="width:65%" class="progress-bar  progress-bar-warning"> 
                                            </div>
                                        </div>                                                   
                                    </div>                                                                                                               
                                    <span class="menu-action">
                                        <span class="menu-action-icon vd_green vd_bd-green" data-original-title="Reboot Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-refresh"></i>
                                        </span> 
                                        <span class="menu-action-icon vd_red vd_bd-red" data-original-title="Stop Server" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-stop"></i>
                                        </span>
                                    </span>                                
                            	</div>
                            </div> 
                    </a></li>                                                                                                                         
                    
               </ul>
               </div> <!-- data-rel="scroll" -->
               <div class="closing text-center" style="">
               		<a href="#">See All Requests <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>
    <li class="one-big-icon mega-li mgl-10"> 
        <a class="mega-link" href="javascript:void(0);"   data-action="click-trigger">
            <span class="mega-icon">
                <i class="fa fa-tasks"></i>
            </span>
            <span class="badge vd_bg-red">
                8
            </span>
        </a>
      <div class="vd_mega-menu-content width-xs-3 width-sm-4 width-md-4 center-xs-4 open-top" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   You have 8 pending tasks
               <div class="vd_panel-menu">
                     <span data-original-title="Task Setting" data-toggle="tooltip" data-placement="bottom" class="menu">
                        <i class="fa fa-cog"></i>
                    </span>                                                                              
                </div>
           </div>                 
		   <div class="content-list content-image">	
           <div data-rel="scroll">
               <ul class="list-wrapper pd-lr-10">
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_blue"><i class="fa fa-bolt"></i></div> 
                            <div class="menu-text"> Electricity Problem
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:85%" class="progress-bar progress-bar-info"> 
                                        	85%
                                        </div>
                                    </div>                                                                                                    
                            	</div>
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_yellow"><i class="fa fa-code"></i></div>  
                            <div class="menu-text">  Finish coding jquery plugin
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:20%" class="progress-bar progress-bar-danger"> 
                                        	20%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li>    
                    <li> <a> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 
                            <div class="menu-text"> Client: Zoe Project
                            	<div class="menu-info">
                                    <span class="menu-date">Make a call</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Call" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-phone"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                     
                            </div> 
                    </a> </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon"><i class=" fa fa-magic"></i></div>  
                            <div class="menu-text">  Final error check on new templates
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:95%" class="progress-bar progress-bar-success"> 
                                        	95%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_green"><i class=" fa fa-camera"></i></div>  
                            <div class="menu-text">  Update product image
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:50%" class="progress-bar progress-bar-warning"> 
                                        	50%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_blue"><i class="fa fa-bolt"></i></div> 
                            <div class="menu-text"> Electricity Problem
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:85%" class="progress-bar progress-bar-info"> 
                                        	85%
                                        </div>
                                    </div>                                                                                                    
                            	</div>
                            </div> 
                    </a> </li>
                    <li> <a href="#"> 
                    		<div class="menu-icon vd_yellow"><i class=" fa fa-code"></i></div>  
                            <div class="menu-text">  Finish coding jquery plugin
                            	<div class="menu-info">
                                    <div class="progress progress-sm">
                                        <div style="width:20%" class="progress-bar progress-bar-danger"> 
                                        	20%
                                        </div>
                                    </div>                                                                                                    
                            	</div>                           
                            </div> 
                    </a> </li>    
                    <li> <a> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-3.jpg"></div> 
                            <div class="menu-text"> Client: Zoe Project
                            	<div class="menu-info">
                                    <span class="menu-date">Make a call</span>                                                                         
                                    <span class="menu-action">
                                        <span class="menu-action-icon" data-original-title="Call" data-toggle="tooltip" data-placement="bottom">
                                            <i class="fa fa-phone"></i>
                                        </span>                                                                            
                                    </span>                                
                            	</div>                                                     
                            </div> 
                    </a> </li>                                     
                                                                                                                       
                    
               </ul>
               </div>
               <div class="closing text-center" style="">
               		<a href="#">See All Tasks <i class="fa fa-angle-double-right"></i></a>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>  
    <li class="one-big-icon mega-li mgl-10"> 
      <a href="index.html" class="mega-link" data-action="click-trigger">
    	<span class="mega-icon"><img alt="example image" src="img/avatar/avatar.jpg"></span> 
		<span class="badge vd_bg-red">10</span>        
      </a>
      <div class="vd_mega-menu-content  open-top width-xs-4 width-md-5 width-lg-4 center-xs-4" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   Jessyline <i>(online)</i>
               <div class="vd_panel-menu">
                     <div  data-rel="tooltip"  data-original-title="Make a Call" class="menu entypo-icon smaller-font">
                        <i class="icon-phone"></i>
                    </div>               
                     <div  data-rel="tooltip"  data-original-title="Video Call" class="menu">
                        <i class="fa fa-video-camera"></i>
                    </div>               
                     <div  data-rel="tooltip"  data-original-title="Message Setting" class="menu smaller-font entypo-icon">
                        <i class="icon-cog"></i>
                    </div>   
                     <div data-rel="tooltip"  data-original-title="Close" class="menu entypo-icon">
                        <i class="icon-cross"></i>
                    </div>                                                                                                 
                </div>
           </div>                 
		   <div class="content-list content-image content-menu">
           	<div data-rel="scroll">	
               <ul class="list-wrapper pd-lr-10">
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text"> Do you play or follow any sports?
                            	<div class="menu-info">
                                    <span class="menu-date">12 Minutes Ago </span>                                                                                                        
                            	</div>
                            </div> 
                    </a> </li>
                    <li class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div>  
                            <div class="menu-text">  Good job mate !
                            	<div class="menu-info">
                                    <span class="menu-date">1 Hour 20 Minutes Ago </span>                                                                         
                              
                            	</div>                            
                            </div> 
                    </a> </li>    
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text">  Just calm down babe, everything will work out.
                            	<div class="menu-info">
                                    <span class="menu-date">12 Days Ago</span>                                                                         
                               
                            	</div>                                                     
                            </div> 
                    </a> </li>                                     
                    <li  class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 
                            <div class="menu-text">  Euuh so gross....
                            	<div class="menu-info">
                                    <span class="menu-date">19 Days Ago</span>                                                                         
                               
                            	</div>                                                        
                            </div> 
                    </a> </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div>  
                            <div class="menu-text">  That's the way.. I like it :D
                            	<div class="menu-info">
                                    <span class="menu-date">20 Days Ago</span>                                                                         
                               
                            	</div>                                                          
                            </div> 
                    </a> </li>
                    <li class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 
                            <div class="menu-text">  Oooh don't be shy ;P
                            	<div class="menu-info">
                                    <span class="menu-date">21 Days Ago</span>                                                                                                       
                            	</div>                             
                            </div> 
                    </a> </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text">  Hello, please call my number..
                            	<div class="menu-info">
                                    <span class="menu-date">24 Days Ago</span>                                                                         
                               
                            	</div>                              
                            </div> 
                    </a> </li> 
                    <li class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 
                            <div class="menu-text">  Don't go anywhere, i will be coming soon
                            	<div class="menu-info">
                                    <span class="menu-date">1 Month 2 days Ago</span>                                                                                                      
                            	</div>                              
                            </div> 
                    </a> </li>                                                                                          
                    
               </ul>
               </div>
               <div class="closing chat-area">
               	   <div class="chat-box">
                   	<input type="text" placeholder="chat here.." />
                   </div>
                   <div class="vd_panel-menu">
                         <div  data-rel="tooltip"  data-original-title="Insert Picture" class="menu">
                            <i class="icon-camera"></i>
                        </div>               
                         <div  data-rel="tooltip"  data-original-title="Emoticons" class="menu">
                            <i class="fa fa-smile-o"></i>
                        </div>                                                                                  
                    </div>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content --> 
    </li>  
    <li class="one-big-icon mega-li mgl-10"> 
      <a href="index.html" class="mega-link" data-action="click-trigger">
    	<span class="mega-icon"><img alt="example image" src="img/avatar/avatar-10.jpg"></span> 
		<span class="badge vd_bg-red">3</span>        
      </a>
      <div class="vd_mega-menu-content  open-top width-xs-4 width-md-5 width-lg-4 center-xs-4" data-action="click-target">
        <div class="child-menu">  
           <div class="title"> 
           	   Jessyline <i>(online)</i>
               <div class="vd_panel-menu">
                     <div  data-rel="tooltip"  data-original-title="Make a Call" class="menu entypo-icon smaller-font">
                        <i class="icon-phone"></i>
                    </div>               
                     <div  data-rel="tooltip"  data-original-title="Video Call" class="menu">
                        <i class="fa fa-video-camera"></i>
                    </div>               
                     <div  data-rel="tooltip"  data-original-title="Message Setting" class="menu smaller-font entypo-icon">
                        <i class="icon-cog"></i>
                    </div>   
                     <div data-rel="tooltip"  data-original-title="Close" class="menu entypo-icon">
                        <i class="icon-cross"></i>
                    </div>                                                                                                 
                </div>
           </div>                 
		   <div class="content-list content-image content-menu">	
           <div   data-rel="scroll">
               <ul class="list-wrapper pd-lr-10" >
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text"> Do you play or follow any sports?
                            	<div class="menu-info">
                                    <span class="menu-date">12 Minutes Ago </span>                                                                                                        
                            	</div>
                            </div> 
                    </a> </li>
                    <li class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div>  
                            <div class="menu-text">  Good job mate !
                            	<div class="menu-info">
                                    <span class="menu-date">1 Hour 20 Minutes Ago </span>                                                                         
                              
                            	</div>                            
                            </div> 
                    </a> </li>    
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text">  Just calm down babe, everything will work out.
                            	<div class="menu-info">
                                    <span class="menu-date">12 Days Ago</span>                                                                         
                               
                            	</div>                                                     
                            </div> 
                    </a> </li>                                     
                    <li  class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 
                            <div class="menu-text">  Euuh so gross....
                            	<div class="menu-info">
                                    <span class="menu-date">19 Days Ago</span>                                                                         
                               
                            	</div>                                                        
                            </div> 
                    </a> </li> 
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div>  
                            <div class="menu-text">  That's the way.. I like it :D
                            	<div class="menu-info">
                                    <span class="menu-date">20 Days Ago</span>                                                                         
                               
                            	</div>                                                          
                            </div> 
                    </a> </li>
                    <li class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 
                            <div class="menu-text">  Oooh don't be shy ;P
                            	<div class="menu-info">
                                    <span class="menu-date">21 Days Ago</span>                                                                                                       
                            	</div>                             
                            </div> 
                    </a> </li>                                     
                    <li> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar.jpg"></div> 
                            <div class="menu-text">  Hello, please call my number..
                            	<div class="menu-info">
                                    <span class="menu-date">24 Days Ago</span>                                                                         
                               
                            	</div>                              
                            </div> 
                    </a> </li> 
                    <li class="align-right"> <a href="#"> 
                    		<div class="menu-icon"><img alt="example image" src="img/avatar/avatar-2.jpg"></div> 
                            <div class="menu-text">  Don't go anywhere, i will be coming soon
                            	<div class="menu-info">
                                    <span class="menu-date">1 Month 2 days Ago</span>                                                                                                      
                            	</div>                              
                            </div> 
                    </a> </li>                                                                                          
                    
               </ul>
               </div>
               <div class="closing chat-area">
               	   <div class="chat-box">
                   	<input type="text" placeholder="chat here.." />
                   </div>
                   <div class="vd_panel-menu">
                         <div  data-rel="tooltip"  data-original-title="Insert Picture" class="menu">
                            <i class="icon-camera"></i>
                        </div>               
                         <div  data-rel="tooltip"  data-original-title="Emoticons" class="menu">
                            <i class="fa fa-smile-o"></i>
                        </div>                                                                                  
                    </div>
               </div>                                                                       
           </div>                              
        </div> <!-- child-menu -->                      
      </div>   <!-- vd_mega-menu-content -->         
    </li>  
     
    <li class="profile mega-li pdlr-15 bordered"> 
        <a class="mega-link" href="#"  data-action="click-trigger"> 
            <span class="menu-name">
                <i class="fa fa-comments append-icon"></i> Chat
            </span>
        </a> 
      <div class="vd_mega-menu-content  width-xs-3  center-xs-3 open-top" data-action="click-target">
        <div class="child-menu"> 
        	<div class="content-list  content-image">
            <div data-rel="scroll">
                <ul class="list-wrapper pd-lr-10">
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar.jpg" alt="example image"></div> 
                                <div class="menu-text">Jessylin
	                                <div class="menu-info">
                                    	<span class="menu-date">Administrator </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                        </a>
                    </li>
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-2.jpg" alt="example image"></div> 
                                <div class="menu-text">Rodney Mc.Cardo
	                                <div class="menu-info">
                                    	<span class="menu-date">Designer </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-grey">&nbsp;</span></div> 
                        </a>
                    </li>
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-3.jpg" alt="example image"></div> 
                                <div class="menu-text">Theresia Minoque
	                                <div class="menu-info">
                                    	<span class="menu-date">Engineering </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                        </a>
                    </li>
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-4.jpg" alt="example image"></div> 
                                <div class="menu-text">Greg Grog
	                                <div class="menu-info">
                                    	<span class="menu-date">Developer </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-grey">&nbsp;</span></div> 
                        </a>
                    </li> 
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-5.jpg" alt="example image"></div> 
                                <div class="menu-text">Stefanie Imburgh
	                                <div class="menu-info">
                                    	<span class="menu-date">Dancer</span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                        </a>
                    </li> 
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-6.jpg" alt="example image"></div> 
                                <div class="menu-text">Matt Demon
	                                <div class="menu-info">
                                    	<span class="menu-date">Musician </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                        </a>
                    </li>
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-7.jpg" alt="example image"></div> 
                                <div class="menu-text">Jeniffer Anastasia
	                                <div class="menu-info">
                                    	<span class="menu-date">Senior Developer </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                        </a>
                    </li>                    
                    <li>  
                        <a href="#"> 
                                <div class="menu-icon"><img src="img/avatar/avatar-8.jpg" alt="example image"></div> 
                                <div class="menu-text">Daniel Dreamon
	                                <div class="menu-info">
                                    	<span class="menu-date">Sales Executive </span>                                                         
                            		</div>
                                </div>
                                <div class="menu-badge"><span class="badge status vd_bg-green">&nbsp;</span></div> 
                        </a>
                    </li>                                                                                                                  
                </ul>
                </div>
            </div> 
        </div> 
      </div>     
  
    </li>  
    <li class="profile border-left mega-li"> 
        <a class="mega-link pd-10" href="javascript:void(0);" data-action="chat-close"> 
            <span class="mega-icon">
                <i class="fa fa-sign-out"></i>
            </span>
        </a> 
    </li>                      
</ul>
<!-- Head menu search form ends -->  
          </div>   
      </div>      
  </div>

</div>

<!-- .vd_body END  -->
<a id="back-top" href="#" data-action="backtop" class="vd_back-top visible"> <i class="fa  fa-angle-up"> </i> </a>

<!--
<a class="back-top" href="#" id="back-top"> <i class="icon-chevron-up icon-white"> </i> </a> -->

<!-- Javascript =============================================== --> 
<!-- Placed at the end of the document so the pages load faster --> 
<script type="text/javascript" src="js/jquery.js"></script> 
<!--[if lt IE 9]>
  <script type="text/javascript" src="js/excanvas.js"></script>      
<![endif]-->
<script type="text/javascript" src="js/bootstrap.min.js"></script> 
<script type="text/javascript" src='plugins/jquery-ui/jquery-ui.custom.min.js'></script>
<script type="text/javascript" src="plugins/jquery-ui-touch-punch/jquery.ui.touch-punch.min.js"></script>

<script type="text/javascript" src="js/caroufredsel.js"></script> 
<script type="text/javascript" src="js/plugins.js"></script>

<script type="text/javascript" src="plugins/breakpoints/breakpoints.js"></script>
<script type="text/javascript" src="plugins/dataTables/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="plugins/prettyPhoto-plugin/js/jquery.prettyPhoto.js"></script> 

<script type="text/javascript" src="plugins/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
<script type="text/javascript" src="plugins/tagsInput/jquery.tagsinput.min.js"></script>
<script type="text/javascript" src="plugins/bootstrap-switch/bootstrap-switch.min.js"></script>
<script type="text/javascript" src="plugins/blockUI/jquery.blockUI.js"></script>
<script type="text/javascript" src="plugins/pnotify/js/jquery.pnotify.min.js"></script>

<script type="text/javascript" src="js/theme.js"></script>
<script type="text/javascript" src="custom/custom.js"></script>
 


<!-- Specific Page Scripts Put Here -->




<!-- Specific Page Scripts END -->






<!-- Google Analytics: Change UA-XXXXX-X to be your site's ID. Go to http://www.google.com/analytics/ for more information. -->

<script>
    var _gaq = _gaq || [];
    _gaq.push(['_setAccount', 'UA-XXXXX-X']);
    _gaq.push(['_trackPageview']);

    (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    })();
</script> 

</body>
</html>