    <ol class="breadcrumb">
      <li><a href="#/">Dashboard</a></li>
      <li>UI Elements</li>
      <li class="active">Buttons</li>
    </ol>

<div class="container-fluid">
<div data-widget-group="group1">
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Default Button Variants</h2>
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default">Default</a></li>
                                <li><a href="#" class="btn btn-primary">Primary</a></li>
                                <li><a href="#" class="btn btn-success">Success</a></li>
                                <li><a href="#" class="btn btn-info">Info</a></li>
                                <li><a href="#" class="btn btn-warning">Warning</a></li>
                                <li><a href="#" class="btn btn-danger">Danger</a></li>
                                <li><a href="#" class="btn btn-inverse">Inverse</a></li>
                            </ul>
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default"><i class="ti ti-settings"></i></a></li>
                                <li><a href="#" class="btn btn-primary"><i class="ti ti-cloud"></i></a></li>
                                <li><a href="#" class="btn btn-success"><i class="ti ti-check"></i></a></li>
                                <li><a href="#" class="btn btn-info"><i class="ti ti-info"></i></a></li>
                                <li><a href="#" class="btn btn-warning"><i class="ti ti-alert"></i></a></li>
                                <li><a href="#" class="btn btn-danger"><i class="ti ti-close"></i></a></li>
                                <li><a href="#" class="btn btn-inverse"><i class="ti ti-panel"></i></a></li>
                            </ul>
                            
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn disabled btn-default">Default</a></li>
                                <li><a href="#" class="btn disabled btn-primary">Primary</a></li>
                                <li><a href="#" class="btn disabled btn-success">Success</a></li>
                                <li><a href="#" class="btn disabled btn-info">Info</a></li>
                                <li><a href="#" class="btn disabled btn-warning">Warning</a></li>
                                <li><a href="#" class="btn disabled btn-danger">Danger</a></li>
                                <li><a href="#" class="btn disabled btn-inverse">Inverse</a></li>
                            </ul>
                            <ul class="demo-btns">
                                <li><a href="#" class="btn disabled btn-default"><i class="ti ti-settings"></i></a></li>                             
                                <li><a href="#" class="btn disabled btn-primary"><i class="ti ti-cloud"></i></a></li>
                                <li><a href="#" class="btn disabled btn-success"><i class="ti ti-check"></i></a></li>
                                <li><a href="#" class="btn disabled btn-info"><i class="ti ti-info-alt"></i></a></li>
                                <li><a href="#" class="btn disabled btn-warning"><i class="ti ti-alert"></i></a></li>
                                <li><a href="#" class="btn disabled btn-danger"><i class="ti ti-close"></i></a></li>
                                <li><a href="#" class="btn disabled btn-inverse"><i class="ti ti-panel"></i></a></li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default-alt">Default</a></li>
                                <li><a href="#" class="btn btn-primary-alt">Primary</a></li>
                                <li><a href="#" class="btn btn-success-alt">Success</a></li>
                                <li><a href="#" class="btn btn-info-alt">Info</a></li>
                                <li><a href="#" class="btn btn-warning-alt">Warning</a></li>
                                <li><a href="#" class="btn btn-danger-alt">Danger</a></li>
                                <li><a href="#" class="btn btn-inverse-alt">Inverse</a></li>
                            </ul>
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default-alt"><i class="ti ti-settings"></i></a></li>                                
                                <li><a href="#" class="btn btn-primary-alt"><i class="ti ti-cloud"></i></a></li>
                                <li><a href="#" class="btn btn-success-alt"><i class="ti ti-check"></i></a></li>
                                <li><a href="#" class="btn btn-info-alt"><i class="ti ti-info-alt"></i></a></li>
                                <li><a href="#" class="btn btn-warning-alt"><i class="ti ti-alert"></i></a></li>
                                <li><a href="#" class="btn btn-danger-alt"><i class="ti ti-close"></i></a></li>
                                <li><a href="#" class="btn btn-inverse-alt"><i class="ti ti-panel"></i></a></li>
                            </ul>
                            
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn disabled btn-default-alt">Default</a></li>
                                <li><a href="#" class="btn disabled btn-primary-alt">Primary</a></li>
                                <li><a href="#" class="btn disabled btn-success-alt">Success</a></li>
                                <li><a href="#" class="btn disabled btn-info-alt">Info</a></li>
                                <li><a href="#" class="btn disabled btn-warning-alt">Warning</a></li>
                                <li><a href="#" class="btn disabled btn-danger-alt">Danger</a></li>
                                <li><a href="#" class="btn disabled btn-inverse-alt">Inverse</a></li>
                            </ul>
                            <ul class="demo-btns">
                                <li><a href="#" class="btn disabled btn-default-alt"><i class="ti ti-settings"></i></a></li>
                                <li><a href="#" class="btn disabled btn-primary-alt"><i class="ti ti-cloud"></i></a></li> 
                                <li><a href="#" class="btn disabled btn-success-alt"><i class="ti ti-check"></i></a></li>
                                <li><a href="#" class="btn disabled btn-info-alt"><i class="ti ti-info-alt"></i></a></li>
                                <li><a href="#" class="btn disabled btn-warning-alt"><i class="ti ti-alert"></i></a></li>
                                <li><a href="#" class="btn disabled btn-danger-alt"><i class="ti ti-close"></i></a></li>
                                <li><a href="#" class="btn disabled btn-inverse-alt"><i class="ti ti-panel"></i></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Button Sizes</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default btn-lg">Large Button</a></li>
                                <li><a href="#" class="btn btn-inverse">Normal Button</a></li>
                                <li><a href="#" class="btn btn-midnightblue btn-sm">Small Button</a></li>
                                <li><a href="#" class="btn btn-default btn-xs">Extra Small</a></li>
                            </ul>
                            
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default btn-lg"><i class="ti ti-settings fa-spin"></i></a></li>
                                <li><a href="#" class="btn btn-inverse"><i class="ti ti-panel"></i></a></li>
                                <li><a href="#" class="btn btn-midnightblue btn-sm"><i class="ti ti-cloud"></i></a></li>
                                <li><a href="#" class="btn btn-default btn-xs"><i class="ti ti-close"></i></a></li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default-alt btn-lg">Large Button</a></li>
                                <li><a href="#" class="btn btn-inverse-alt">Normal Button</a></li>
                                <li><a href="#" class="btn btn-midnightblue-alt btn-sm">Small Button</a></li>
                                <li><a href="#" class="btn btn-info-alt btn-xs">Extra Small</a></li>
                            </ul>
                            
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-default-alt btn-lg"><i class="ti ti-settings fa-spin"></i></a></li>
                                <li><a href="#" class="btn btn-inverse-alt"><i class="ti ti-panel"></i></a></li>
                                <li><a href="#" class="btn btn-midnightblue-alt btn-sm"><i class="ti ti-cloud"></i></a></li>
                                <li><a href="#" class="btn btn-info-alt btn-xs"><i class="ti ti-close"></i></a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Button Blocks</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">
                    
                    <div class="row">
                        <div class="col-md-3">
                            <p>
                                <a href="#" class="btn btn-default btn-lg btn-block">Large Block</a>
                                <a href="#" class="btn btn-primary btn-block">Normal Block</a>
                                <a href="#" class="btn btn-info btn-sm btn-block">Small Block</a>
                                <a href="#" class="btn btn-success btn-xs btn-block">Extra Small Block</a>
                            </p>
                        </div>
                        <div class="col-md-3">
                            <p>
                                <a href="#" class="btn btn-inverse btn-lg btn-block"><i class="ti ti-pencil"></i></a>
                                <a href="#" class="btn btn-warning btn-block"><i class="ti ti-panel"></i></a>
                                <a href="#" class="btn btn-orange btn-sm btn-block"><i class="ti ti-cloud"></i></a>
                                <a href="#" class="btn btn-default btn-xs btn-block"><i class="ti ti-settings"></i></a>
                            </p>
                        </div>
                        <div class="col-md-3">
                            <p>
                                <a href="#" class="btn btn-default-alt btn-lg btn-block">Large Block</a>
                                <a href="#" class="btn btn-primary-alt btn-block">Normal Block</a>
                                <a href="#" class="btn btn-info-alt btn-sm btn-block">Small Block</a>
                                <a href="#" class="btn btn-success-alt btn-xs btn-block">Extra Small Block</a>
                            </p>
                        </div>
                        <div class="col-md-3">
                            <p>
                                <a href="#" class="btn btn-inverse-alt btn-lg btn-block"><i class="ti ti-pencil"></i></a>
                                <a href="#" class="btn btn-warning-alt btn-block"><i class="ti ti-panel"></i></a>
                                <a href="#" class="btn btn-orange-alt btn-sm btn-block"><i class="ti ti-cloud"></i></a>
                                <a href="#" class="btn btn-danger-alt btn-xs btn-block"><i class="ti ti-settings"></i></a>
                            </p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Button Dropdowns</h2>
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                            Dropdown <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-midnightblue dropdown-toggle" data-toggle="dropdown">
                                            <i class="ti ti-settings"></i> <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <a href="#" class="btn btn-inverse">Dropdown</a>
                                        <a href="#" class="btn btn-inverse dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <a href="#" class="btn btn-primary"><i class="ti ti-settings"></i></a>
                                        <a href="#" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                            </ul>
                            
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group dropup">
                                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                            Dropdown <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group dropup">
                                        <button type="button" class="btn btn-midnightblue dropdown-toggle" data-toggle="dropdown">
                                            <i class="ti ti-settings"></i> <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group dropup">
                                        <a href="#" class="btn btn-inverse">Dropdown</a>
                                        <a href="#" class="btn btn-inverse dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group dropup">
                                        <a href="#" class="btn btn-primary"><i class="ti ti-settings"></i></a>
                                        <a href="#" class="btn btn-primary dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default-alt dropdown-toggle" data-toggle="dropdown">
                                            Dropdown <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-midnightblue-alt dropdown-toggle" data-toggle="dropdown">
                                            <i class="ti ti-settings"></i> <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <a href="#" class="btn btn-inverse-alt">Dropdown</a>
                                        <a href="#" class="btn btn-inverse-alt dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <a href="#" class="btn btn-primary-alt"><i class="ti ti-settings"></i></a>
                                        <a href="#" class="btn btn-primary-alt dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                            </ul>
                            
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group dropup">
                                        <button type="button" class="btn btn-default-alt dropdown-toggle" data-toggle="dropdown">
                                            Dropdown <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group dropup">
                                        <button type="button" class="btn btn-midnightblue-alt dropdown-toggle" data-toggle="dropdown">
                                            <i class="ti ti-settings"></i> <span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group dropup">
                                        <a href="#" class="btn btn-inverse-alt">Dropdown</a>
                                        <a href="#" class="btn btn-inverse-alt dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                                <li>
                                    <div class="btn-group dropup">
                                        <a href="#" class="btn btn-primary-alt"><i class="ti ti-settings"></i></a>
                                        <a href="#" class="btn btn-primary-alt dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></a>
                                        <ul class="dropdown-menu" role="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>
                                </li>
                            </ul>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="btn-group btn-block">
                                <button type="button" class="btn btn-block btn-default dropdown-toggle" data-toggle="dropdown">
                                    <i class="ti ti-settings"></i> Settings <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu col-xs-12" role="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 class="btn-group btn-block dropup">
                                <button type="button" class="btn btn-block btn-primary dropdown-toggle" data-toggle="dropdown">
                                    <i class="ti ti-settings"></i> Settings <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu col-xs-12" role="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 class="col-md-6">
                            <div class="btn-group btn-block">
                                <button type="button" class="btn btn-block btn-default-alt dropdown-toggle" data-toggle="dropdown">
                                    <i class="ti ti-settings"></i> Settings <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu col-xs-12" role="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 class="btn-group btn-block dropup">
                                <button type="button" class="btn btn-block btn-primary-alt dropdown-toggle" data-toggle="dropdown">
                                    <i class="ti ti-settings"></i> Settings <span class="caret"></span>
                                </button>
                                <ul class="dropdown-menu col-xs-12" role="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>
    </div>

       
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Button Groups</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-6">
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default">Left</button>
                                        <button type="button" class="btn btn-default">Middle</button>
                                        <button type="button" class="btn btn-default">Right</button>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-success">Success</button>
                                        <button type="button" class="btn btn-inverse">Inverse</button>
                                        <button type="button" class="btn btn-midnightblue">Midnight</button>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default"><i class="ti ti-align-left"></i></button>
                                        <button type="button" class="btn btn-default"><i class="ti ti-align-center"></i></button>
                                        <button type="button" class="btn btn-default"><i class="ti ti-align-right"></i></button>
                                        <button type="button" class="btn btn-default"><i class="ti ti-align-justify"></i></button>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-info"><i class="ti ti-check"></i></button>
                                        <button type="button" class="btn btn-warning"><i class="ti ti-cloud"></i></button>
                                        <button type="button" class="btn btn-orange"><i class="ti ti-menu"></i></button>
                                        <button type="button" class="btn btn-danger"><i class="ti ti-settings"></i></button>
                                    </div>
                                </li>
                            </ul>
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-toolbar">
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default">1</button>
                                            <button type="button" class="btn btn-default">2</button>
                                            <button type="button" class="btn btn-default">3</button>
                                            <button type="button" class="btn btn-default">4</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default">5</button>
                                            <button type="button" class="btn btn-default">6</button>
                                            <button type="button" class="btn btn-default">7</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default">8</button>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-toolbar">
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default">1</button>
                                            <button type="button" class="btn btn-primary">2</button>
                                            <button type="button" class="btn btn-info">3</button>
                                            <button type="button" class="btn btn-success">4</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-warning">5</button>
                                            <button type="button" class="btn btn-orange">6</button>
                                            <button type="button" class="btn btn-danger">7</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-midnightblue">8</button>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default-alt">Left</button>
                                        <button type="button" class="btn btn-default-alt">Middle</button>
                                        <button type="button" class="btn btn-default-alt">Right</button>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-success-alt">Success</button>
                                        <button type="button" class="btn btn-inverse-alt">Inverse</button>
                                        <button type="button" class="btn btn-midnightblue-alt">Midnight</button>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-default-alt"><i class="ti ti-align-left"></i></button>
                                        <button type="button" class="btn btn-default-alt"><i class="ti ti-align-center"></i></button>
                                        <button type="button" class="btn btn-default-alt"><i class="ti ti-align-right"></i></button>
                                        <button type="button" class="btn btn-default-alt"><i class="ti ti-align-justify"></i></button>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group">
                                        <button type="button" class="btn btn-info-alt"><i class="ti ti-check"></i></button>
                                        <button type="button" class="btn btn-warning-alt"><i class="ti ti-cloud"></i></button>
                                        <button type="button" class="btn btn-orange-alt"><i class="ti ti-menu"></i></button>
                                        <button type="button" class="btn btn-danger-alt"><i class="ti ti-settings"></i></button>
                                    </div>
                                </li>
                            </ul>
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-toolbar">
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default-alt">1</button>
                                            <button type="button" class="btn btn-default-alt">2</button>
                                            <button type="button" class="btn btn-default-alt">3</button>
                                            <button type="button" class="btn btn-default-alt">4</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default-alt">5</button>
                                            <button type="button" class="btn btn-default-alt">6</button>
                                            <button type="button" class="btn btn-default-alt">7</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default-alt">8</button>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-toolbar">
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-default-alt">1</button>
                                            <button type="button" class="btn btn-primary-alt">2</button>
                                            <button type="button" class="btn btn-info-alt">3</button>
                                            <button type="button" class="btn btn-success-alt">4</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-warning-alt">5</button>
                                            <button type="button" class="btn btn-danger-alt">6</button>
                                            <button type="button" class="btn btn-inverse-alt">7</button>
                                        </div>
                                        <div class="btn-group">
                                            <button type="button" class="btn btn-midnightblue-alt">8</button>
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Button Groups</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">
                    
                    <div class="row">
                        <div class="col-md-2">
                            <div class="btn-group-vertical">
                                <button type="button" class="btn btn-default">Top</button>
                                <button type="button" class="btn btn-default">Middle</button>
                                <button type="button" class="btn btn-default">Bottom</button>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="btn-group-vertical">
                                <a class="btn btn-default" href="#"><i class="ti ti-align-left"></i></a>
                                <a class="btn btn-default" href="#"><i class="ti ti-align-center"></i></a>
                                <a class="btn btn-default" href="#"><i class="ti ti-align-right"></i></a>
                                <a class="btn btn-default" href="#"><i class="ti ti-align-justify"></i></a>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="btn-group-vertical">
                                <a class="btn btn-success" href="#"><i class="ti ti-check"></i></a>
                                <a class="btn btn-primary" href="#"><i class="ti ti-cloud"></i></a>
                                <a class="btn btn-inverse" href="#"><i class="ti ti-settings"></i></a>
                                <a class="btn btn-midnightblue" href="#"><i class="ti ti-menu"></i></a>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="btn-group-vertical">
                                <button type="button" class="btn btn-default-alt">Top</button>
                                <button type="button" class="btn btn-default-alt">Middle</button>
                                <button type="button" class="btn btn-default-alt">Bottom</button>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="btn-group-vertical">
                                <a class="btn btn-default-alt" href="#"><i class="ti ti-align-left"></i></a>
                                <a class="btn btn-default-alt" href="#"><i class="ti ti-align-center"></i></a>
                                <a class="btn btn-default-alt" href="#"><i class="ti ti-align-right"></i></a>
                                <a class="btn btn-default-alt" href="#"><i class="ti ti-align-justify"></i></a>
                            </div>
                        </div>
                        <div class="col-md-2">
                            <div class="btn-group-vertical">
                                <a class="btn btn-success-alt" href="#"><i class="ti ti-check"></i></a>
                                <a class="btn btn-primary-alt" href="#"><i class="ti ti-cloud"></i></a>
                                <a class="btn btn-inverse-alt" href="#"><i class="ti ti-settings"></i></a>
                                <a class="btn btn-midnightblue-alt" href="#"><i class="ti ti-menu"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Label Buttons</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">           
                    <div class="row">
                        <div class="col-md-6">
                               
                            <ul class="demo-btns">
                                <li><a class="btn btn-lg btn-inverse btn-label" href="#"><i class="ti ti-settings"></i> Settings</a></li>
                                <li><a class="btn btn-lg btn-inverse btn-label" href="#"><i class="ti ti-download"></i> Download</a></li>
                                
                            </ul>
                            <ul class="demo-btns">
                                <li><a class="btn btn-success btn-label" href="#"><i class="ti ti-check"></i> Checked</a></li>
                                <li><a class="btn btn-success btn-label" href="#"><i class="ti ti-time"></i> Activity</a></li>
                                <li><a class="btn btn-success btn-label" href="#"><i class="ti ti-pencil"></i> Edit</a></li>
                                
                            </ul>
                            <ul class="demo-btns">
                                <li><a class="btn btn-sm btn-warning btn-label" href="#"><i class="ti ti-bookmark"></i> Bookmark</a></li>
                                <li><a class="btn btn-sm btn-warning btn-label" href="#"><i class="ti ti-cloud"></i> Cloud</a></li>
                                <li><a class="btn btn-sm btn-warning btn-label" href="#"><i class="ti ti-flag"></i> Flag</a></li>
                                
                            </ul>
                            <ul class="demo-btns">
                                <li><a class="btn btn-xs btn-danger btn-label" href="#"><i class="ti ti-close"></i> Cancel</a></li>
                                <li><a class="btn btn-xs btn-danger btn-label" href="#"><i class="ti ti-na"></i> Delete</a></li>
                                <li><a class="btn btn-xs btn-danger btn-label" href="#"><i class="ti ti-trash"></i> Remove</a></li>
                                
                            </ul>
                        </div>
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a class="btn btn-lg btn-primary-alt btn-label" href="#"><i class="ti ti-settings"></i> Settings</a></li>
                                <li><a class="btn btn-lg btn-primary-alt btn-label" href="#"><i class="ti ti-download"></i> Download</a></li>
                                
                            </ul>
                            <ul class="demo-btns">
                                <li><a class="btn btn-success-alt btn-label" href="#"><i class="ti ti-check"></i> Checked</a></li>
                                <li><a class="btn btn-success-alt btn-label" href="#"><i class="ti ti-time"></i> Activity</a></li>
                                <li><a class="btn btn-success-alt btn-label" href="#"><i class="ti ti-pencil"></i> Edit</a></li>
                                
                            </ul>
                            <ul class="demo-btns">
                                <li><a class="btn btn-sm btn-warning-alt btn-label" href="#"><i class="ti ti-bookmark"></i> Bookmark</a></li>
                                <li><a class="btn btn-sm btn-warning-alt btn-label" href="#"><i class="ti ti-cloud"></i> Cloud</a></li>
                                <li><a class="btn btn-sm btn-warning-alt btn-label" href="#"><i class="ti ti-flag"></i> Flag</a></li>
                                
                            </ul>
                            <ul class="demo-btns">
                                <li><a class="btn btn-xs btn-danger-alt btn-label" href="#"><i class="ti ti-close"></i> Cancel</a></li>
                                <li><a class="btn btn-xs btn-danger-alt btn-label" href="#"><i class="ti ti-na"></i> Delete</a></li>
                                <li><a class="btn btn-xs btn-danger-alt btn-label" href="#"><i class="ti ti-trash"></i> Remove</a></li>
                                
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-xs-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Button States</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-default">Loading state</button></li>
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-success">Loading state</button></li>
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-warning">Loading state</button></li>
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-danger">Loading state</button></li>
                            </ul>
                            
                            <ul class="demo-btns">
                                <li><button type="button" class="btn btn-primary" data-toggle="button">Single toggle</button></li>
                                <li><button type="button" class="btn btn-success" data-toggle="button">Single toggle</button></li>
                                <li><button type="button" class="btn btn-warning" data-toggle="button">Single toggle</button></li>
                                <li><button type="button" class="btn btn-danger" data-toggle="button">Single toggle</button></li>
                            </ul>
                            
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-primary">
                                            <input type="checkbox"> Option 1
                                        </label>
                                        <label class="btn btn-primary">
                                            <input type="checkbox"> Option 2
                                        </label>
                                        <label class="btn btn-primary">
                                            <input type="checkbox"> Option 3
                                        </label>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-primary">
                                            <input type="checkbox"><i class="ti ti-apple"></i>
                                        </label>
                                        <label class="btn btn-primary">
                                            <input type="checkbox"><i class="ti ti-android"></i>
                                        </label>
                                        <label class="btn btn-primary">
                                            <input type="checkbox"><i class="ti ti-microsoft"></i>
                                        </label>
                                    </div>
                                </li>
                            </ul>

                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-midnightblue">
                                            <input type="radio" name="options" id="option1"> Option 1
                                        </label>
                                        <label class="btn btn-midnightblue">
                                            <input type="radio" name="options" id="option2"> Option 2
                                        </label>
                                        <label class="btn btn-midnightblue">
                                            <input type="radio" name="options" id="option3"> Option 3
                                        </label>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-midnightblue">
                                            <input type="radio" name="options" id="option1"><i class="ti ti-control-play"></i>
                                        </label>
                                        <label class="btn btn-midnightblue">
                                            <input type="radio" name="options" id="option2"><i class="ti ti-control-stop"></i>
                                        </label>
                                        <label class="btn btn-midnightblue">
                                            <input type="radio" name="options" id="option3"><i class="ti ti-volume"></i>
                                        </label>
                                    </div>
                                </li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-default-alt">Loading state</button></li>
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-success-alt">Loading state</button></li>
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-warning-alt">Loading state</button></li>
                                <li><button type="button" data-loading-text="Loading..." class="loading-example-btn btn btn-danger-alt">Loading state</button></li>
                            </ul>
                            
                            <ul class="demo-btns">
                                <li><button type="button" class="btn btn-primary-alt" data-toggle="button">Single toggle</button></li>
                                <li><button type="button" class="btn btn-success-alt" data-toggle="button">Single toggle</button></li>
                                <li><button type="button" class="btn btn-warning-alt" data-toggle="button">Single toggle</button></li>
                                <li><button type="button" class="btn btn-danger-alt" data-toggle="button">Single toggle</button></li>
                            </ul>
                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-primary-alt">
                                            <input type="checkbox"> Option 1
                                        </label>
                                        <label class="btn btn-primary-alt">
                                            <input type="checkbox"> Option 2
                                        </label>
                                        <label class="btn btn-primary-alt">
                                            <input type="checkbox"> Option 3
                                        </label>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-primary-alt">
                                            <input type="checkbox"><i class="ti ti-apple"></i>
                                        </label>
                                        <label class="btn btn-primary-alt">
                                            <input type="checkbox"><i class="ti ti-android"></i>
                                        </label>
                                        <label class="btn btn-primary-alt">
                                            <input type="checkbox"><i class="ti ti-microsoft"></i>
                                        </label>
                                    </div>
                                </li>
                            </ul>

                            <ul class="demo-btns">
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-midnightblue-alt">
                                            <input type="radio" name="options" id="option1"> Option 1
                                        </label>
                                        <label class="btn btn-midnightblue-alt">
                                            <input type="radio" name="options" id="option2"> Option 2
                                        </label>
                                        <label class="btn btn-midnightblue-alt">
                                            <input type="radio" name="options" id="option3"> Option 3
                                        </label>
                                    </div>
                                </li>
                                <li>
                                    <div class="btn-group" data-toggle="buttons">
                                        <label class="btn btn-midnightblue-alt">
                                            <input type="radio" name="options" id="option1"><i class="ti ti-control-play"></i>
                                        </label>
                                        <label class="btn btn-midnightblue-alt">
                                            <input type="radio" name="options" id="option2"><i class="ti ti-control-stop"></i>
                                        </label>
                                        <label class="btn btn-midnightblue-alt">
                                            <input type="radio" name="options" id="option3"><i class="ti ti-volume"></i>
                                        </label>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>

                    

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



    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-transparent" data-widget='{"draggable": "false"}'>
                <div class="panel-heading">
                    <h2>Social Icons</h2>
                    <!-- <div class="panel-ctrls" data-actions-container="" data-action-collapse='{"target": ".panel-body"}'></div> -->
                </div>
                <div class="panel-body">
                    <div class="row">
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-social btn-facebook"><i class="ti ti-facebook"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-twitter"><i class="ti ti-twitter"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-github"><i class="ti ti-github"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-flickr"><i class="ti ti-flickr"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-jsfiddle"><i class="ti ti-jsfiddle"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-reddit"><i class="ti ti-reddit"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-youtube"><i class="ti ti-youtube"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-google"><i class="ti ti-google"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-apple"><i class="ti ti-apple"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-soundcloud"><i class="ti ti-soundcloud"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-wordpress"><i class="ti ti-wordpress"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-skype"><i class="ti ti-skype"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-android"><i class="ti ti-android"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-linkedin"><i class="ti ti-linkedin"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-googleplus"><i class="ti ti-google"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-instagram"><i class="ti ti-instagram"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-windows"><i class="ti ti-microsoft"></i></a></li>
                            </ul>

                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-social btn-facebook-alt"><i class="ti ti-facebook"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-twitter-alt"><i class="ti ti-twitter"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-github-alt"><i class="ti ti-github"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-flickr-alt"><i class="ti ti-flickr"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-jsfiddle-alt"><i class="ti ti-jsfiddle"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-reddit-alt"><i class="ti ti-reddit"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-youtube-alt"><i class="ti ti-youtube"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-google-alt"><i class="ti ti-google"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-apple-alt"><i class="ti ti-apple"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-soundcloud-alt"><i class="ti ti-soundcloud"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-wordpress-alt"><i class="ti ti-wordpress"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-skype-alt"><i class="ti ti-skype"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-android-alt"><i class="ti ti-android"></i></a></li>
                                
                                <li><a href="#" class="btn btn-social btn-linkedin-alt"><i class="ti ti-linkedin"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-googleplus-alt"><i class="ti ti-google"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-instagram-alt"><i class="ti ti-instagram"></i></a></li>
                                <li><a href="#" class="btn btn-social btn-windows-alt"><i class="ti ti-microsoft"></i></a></li>
                            </ul>

                        </div>
                        <div class="col-md-6">
                            
                            <ul class="demo-btns">
                                <li><a href="#" class="btn btn-label btn-social btn-facebook"><i class="ti ti-facebook"></i>Facebook</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-twitter"><i class="ti ti-twitter"></i>Twitter</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-github"><i class="ti ti-github"></i>Github</a></li>
                                
                                <li><a href="#" class="btn btn-label btn-social btn-flickr"><i class="ti ti-flickr"></i>Flickr</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-jsfiddle"><i class="ti ti-jsfiddle"></i>jsFiddle</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-reddit"><i class="ti ti-reddit"></i>Reddit</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-youtube"><i class="ti ti-youtube"></i>YouTube</a></li>
                                
                                <li><a href="#" class="btn btn-label btn-social btn-google"><i class="ti ti-google"></i>Google</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-apple"><i class="ti ti-apple"></i>Apple</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-soundcloud"><i class="ti ti-soundcloud"></i>Soundcloud</a></li>
                                
                                <li><a href="#" class="btn btn-label btn-social btn-wordpress"><i class="ti ti-wordpress"></i>Wordpress</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-skype"><i class="ti ti-skype"></i>Skype</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-android"><i class="ti ti-android"></i>Android</a></li>
                                
                                <li><a href="#" class="btn btn-label btn-social btn-linkedin"><i class="ti ti-linkedin"></i>LinkedIn</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-googleplus"><i class="ti ti-google"></i>Google Plus+</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-instagram"><i class="ti ti-instagram"></i>Instagram</a></li>
                                <li><a href="#" class="btn btn-label btn-social btn-windows"><i class="ti ti-microsoft"></i>Windows</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</div> <!-- container-fluid -->
