diff --git a/app/Http/Controllers/Admin/helpdesk/DepartmentController.php b/app/Http/Controllers/Admin/helpdesk/DepartmentController.php
index c007966d9..5038136f0 100644
--- a/app/Http/Controllers/Admin/helpdesk/DepartmentController.php
+++ b/app/Http/Controllers/Admin/helpdesk/DepartmentController.php
@@ -157,7 +157,7 @@ class DepartmentController extends Controller
                     ->first();
             $slas = $sla->where('status', '=', 1)
                     ->select('grace_period', 'id')->get();
-            $user = $user->where('primary_dpt', $id)
+            $user = $user->where('role', '<>', 'user')
             ->where('active', '=', 1)
             ->get();
             $emails = $email->select('email_name', 'id')->get();
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/agents/create.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/agents/create.blade.php
index 04d23ad16..e66f9e64e 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/agents/create.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/agents/create.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('agents')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -30,192 +34,194 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!! Form::open(array('action' => 'Admin\helpdesk\AgentController@store' , 'method' => 'post') )!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.create_an_agent') !!}</h3>	
+
+@if(Session::has('errors'))
+<?php //dd($errors); ?>
+<div class="alert alert-danger alert-dismissable">
+    <i class="fas fa-ban"></i>
+    <b>{!! Lang::get('lang.alert') !!}!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('user_name'))
+    <li class="error-message-padding">{!! $errors->first('user_name', ':message') !!}</li>
+    @endif
+    @if($errors->first('first_name'))
+    <li class="error-message-padding">{!! $errors->first('first_name', ':message') !!}</li>
+    @endif
+    @if($errors->first('last_name'))
+    <li class="error-message-padding">{!! $errors->first('last_name', ':message') !!}</li>
+    @endif
+    @if($errors->first('email'))
+    <li class="error-message-padding">{!! $errors->first('email', ':message') !!}</li>
+    @endif
+    @if($errors->first('ext'))
+    <li class="error-message-padding">{!! $errors->first('ext', ':message') !!}</li>
+    @endif
+    @if($errors->first('phone_number'))
+    <li class="error-message-padding">{!! $errors->first('phone_number', ':message') !!}</li>
+    @endif
+    @if($errors->first('country_code'))
+    <li class="error-message-padding">{!! $errors->first('country_code', ':message') !!}</li>
+    @endif
+    @if($errors->first('mobile'))
+    <li class="error-message-padding">{!! $errors->first('mobile', ':message') !!}</li>
+    @endif
+    @if($errors->first('active'))
+    <li class="error-message-padding">{!! $errors->first('active', ':message') !!}</li>
+    @endif
+    @if($errors->first('role'))
+    <li class="error-message-padding">{!! $errors->first('role', ':message') !!}</li>
+    @endif
+    @if($errors->first('group'))
+    <li class="error-message-padding">{!! $errors->first('group', ':message') !!}</li>
+    @endif
+    @if($errors->first('primary_department'))
+    <li class="error-message-padding">{!! $errors->first('primary_department', ':message') !!}</li>
+    @endif
+    @if($errors->first('agent_time_zone'))
+    <li class="error-message-padding">{!! $errors->first('agent_time_zone', ':message') !!}</li>
+    @endif
+    @if($errors->first('team'))
+    <li class="error-message-padding">{!! $errors->first('team', ':message') !!}</li>
+    @endif
+</div>
+@endif
+@if(Session::has('fails2'))
+    <div class="alert alert-danger alert-dismissable">
+    <i class="fas fa-ban"></i>
+    <b>Alert!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+        <li class="error-message-padding">{!! Session::get('fails2') !!}</li>
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-        <?php //dd($errors); ?>
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>{!! Lang::get('lang.alert') !!}!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-            @if($errors->first('user_name'))
-            <li class="error-message-padding">{!! $errors->first('user_name', ':message') !!}</li>
-            @endif
-            @if($errors->first('first_name'))
-            <li class="error-message-padding">{!! $errors->first('first_name', ':message') !!}</li>
-            @endif
-            @if($errors->first('last_name'))
-            <li class="error-message-padding">{!! $errors->first('last_name', ':message') !!}</li>
-            @endif
-            @if($errors->first('email'))
-            <li class="error-message-padding">{!! $errors->first('email', ':message') !!}</li>
-            @endif
-            @if($errors->first('ext'))
-            <li class="error-message-padding">{!! $errors->first('ext', ':message') !!}</li>
-            @endif
-            @if($errors->first('phone_number'))
-            <li class="error-message-padding">{!! $errors->first('phone_number', ':message') !!}</li>
-            @endif
-            @if($errors->first('country_code'))
-            <li class="error-message-padding">{!! $errors->first('country_code', ':message') !!}</li>
-            @endif
-            @if($errors->first('mobile'))
-            <li class="error-message-padding">{!! $errors->first('mobile', ':message') !!}</li>
-            @endif
-            @if($errors->first('active'))
-            <li class="error-message-padding">{!! $errors->first('active', ':message') !!}</li>
-            @endif
-            @if($errors->first('role'))
-            <li class="error-message-padding">{!! $errors->first('role', ':message') !!}</li>
-            @endif
-            @if($errors->first('group'))
-            <li class="error-message-padding">{!! $errors->first('group', ':message') !!}</li>
-            @endif
-            @if($errors->first('primary_department'))
-            <li class="error-message-padding">{!! $errors->first('primary_department', ':message') !!}</li>
-            @endif
-            @if($errors->first('agent_time_zone'))
-            <li class="error-message-padding">{!! $errors->first('agent_time_zone', ':message') !!}</li>
-            @endif
-            @if($errors->first('team'))
-            <li class="error-message-padding">{!! $errors->first('team', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
-        @if(Session::has('fails2'))
-            <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>Alert!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-                <li class="error-message-padding">{!! Session::get('fails2') !!}</li>
-            </div>
-        @endif
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.create_an_agent') !!}</h3>	
+    </div>
+    <div class="card-body">
         <div class="row">
             <!-- username -->
-            <div class="col-xs-4 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}">
                 {!! Form::label('user_name',Lang::get('lang.user_name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('user_name',null,['class' => 'form-control']) !!}
             </div>
             <!-- firstname -->
-            <div class="col-xs-4 form-group {{ $errors->has('first_name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('first_name') ? 'has-error' : '' }}">
                 {!! Form::label('first_name',Lang::get('lang.first_name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('first_name',null,['class' => 'form-control']) !!}
             </div>
             <!-- lastname -->
-            <div class="col-xs-4 form-group {{ $errors->has('last_name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('last_name') ? 'has-error' : '' }}">
                 {!! Form::label('last_name',Lang::get('lang.last_name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('last_name',null,['class' => 'form-control']) !!}
             </div>
         </div>
         <div class="row">
             <!-- email address -->
-            <div class="col-xs-4 form-group {{ $errors->has('email') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('email') ? 'has-error' : '' }}">
                 {!! Form::label('email',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
                 {!! Form::email('email',null,['class' => 'form-control']) !!}
             </div>
-            <div class="col-xs-1 form-group {{ $errors->has('ext') ? 'has-error' : '' }}">
+            <div class="col-sm-1 form-group {{ $errors->has('ext') ? 'has-error' : '' }}">
                 <label for="ext">{!! Lang::get('lang.ext') !!}</label>	
                 {!! Form::text('ext',null,['class' => 'form-control']) !!}
             </div>
             <!--country code-->
-            <div class="col-xs-1 form-group {{  $errors->has('country_code') ? 'has-error' : '' }}">
+            <div class="col-sm-1 form-group {{  $errors->has('country_code') ? 'has-error' : '' }}">
 
                 {!! Form::label('country_code',Lang::get('lang.country-code')) !!} @if($send_otp->status ==1)<span class="text-red"> *</span>@endif
                 {!! Form::text('country_code',null,['class' => 'form-control', 'placeholder' => $phonecode, 'title' => Lang::get('lang.enter-country-phone-code')]) !!}
 
             </div>
             <!-- phone -->
-            <div class="col-xs-3 form-group {{ $errors->has('phone_number') ? 'has-error' : '' }}">
+            <div class="col-sm-3 form-group {{ $errors->has('phone_number') ? 'has-error' : '' }}">
                 {!! Form::label('phone_number',Lang::get('lang.phone')) !!}
                 {!! Form::text('phone_number',null,['class' => 'form-control']) !!}
             </div>
             <!-- Mobile -->
-            <div class="col-xs-3 form-group {{ $errors->has('mobile') ? 'has-error' : '' }}">
+            <div class="col-sm-3 form-group {{ $errors->has('mobile') ? 'has-error' : '' }}">
                 {!! Form::label('mobile',Lang::get('lang.mobile_number')) !!}@if($send_otp->status ==1)<span class="text-red"> *</span>@endif
                 {!! Form::input('number', 'mobile',null,['class' => 'form-control']) !!}
             </div>
         </div>
-        <div>
-            <h4>{!! Lang::get('lang.agent_signature') !!}</h4>
-        </div>
-        <div class="">
-            {!! Form::textarea('agent_sign',null,['class' => 'form-control','size' => '30x5']) !!}
-        </div>
-        <div>
-            <h4>{{Lang::get('lang.account_status_setting')}}</h4>
-        </div>
-        <div class="row">
-            <div class="col-xs-6">
-                <!-- acccount type -->
-                <div class="form-group {{ $errors->has('active') ? 'has-error' : '' }}">
-                    {!! Form::label('active',Lang::get('lang.status')) !!}
-                    <div class="row">
-                        <div class="col-xs-3">
-                            {!! Form::radio('active','1',true) !!} {{Lang::get('lang.active')}}
-                        </div>
-                        <div class="col-xs-3">
-                            {!! Form::radio('active','0',null) !!} {{Lang::get('lang.inactive')}}
-                        </div>
-                    </div>
-                </div>
-                <!-- Role -->
-                <div class="form-group {{ $errors->has('role') ? 'has-error' : '' }}">
-                    {!! Form::label('role',Lang::get('lang.role')) !!}
-                    <div class="row">
-                        <div class="col-xs-3">
-                            {!! Form::radio('role','admin',true) !!} {{Lang::get('lang.admin')}}
-                        </div>
-                        <div class="col-xs-3">
-                            {!! Form::radio('role','agent',null) !!} {{Lang::get('lang.agent')}}
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <div class="col-xs-6">
-            </div>
-        </div>
+      
         <div class="row">
             <!-- assigned group -->
-            <div class="col-xs-4 form-group {{ $errors->has('group') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('group') ? 'has-error' : '' }}">
                 {!! Form::label('assign_group',Lang::get('lang.assigned_group')) !!} <span class="text-red"> *</span>
                 {!!Form::select('group',[''=>Lang::get('lang.select_a_group'),Lang::get('lang.groups')=>$groups->pluck('name','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
 
            <!-- primary department -->
-            <div class="col-xs-4 form-group {{ $errors->has('primary_department') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('primary_department') ? 'has-error' : '' }}">
                 {!! Form::label('primary_dpt', Lang::get('lang.primary_department')) !!} <span class="text-red"> *</span>
 
                 {!!Form::select('primary_department', [''=>Lang::get('lang.select_a_department'), Lang::get('lang.departments')=>$departments->pluck('name','id')->toArray()],'',['class' => 'form-control select']) !!}
             </div>
 
             <!-- timezone -->
-            <div class="col-xs-4 form-group {{ $errors->has('agent_time_zone') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('agent_time_zone') ? 'has-error' : '' }}">
                 {!! Form::label('agent_tzone',Lang::get('lang.agent_time_zone')) !!} <span class="text-red"> *</span>
                 {!! Form::select('agent_time_zone', [''=>Lang::get('lang.select_a_time_zone'),Lang::get('lang.time_zones')=>$timezones->pluck('name','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
         </div>
-        <!-- Assign team -->
-        <div class="form-group {{ $errors->has('team') ? 'has-error' : '' }}">
-            {!! Form::label('agent_tzone',Lang::get('lang.assigned_team')) !!} <span class="text-red"> *</span>
-            @foreach($teams as $key => $val)
-            <div class="form-group ">
-                <input type="checkbox" name="team[]" value="{!! $val !!}"  > {!! $key !!}<br/>
+
+        <div class="row">
+            <div class="col-sm-4">
+                <!-- acccount type -->
+                <div class="form-group {{ $errors->has('active') ? 'has-error' : '' }}">
+                    {!! Form::label('active',Lang::get('lang.status')) !!}
+                    <div class="row">
+                        <div class="col-sm-3">
+                            {!! Form::radio('active','1',true) !!} {{Lang::get('lang.active')}}
+                        </div>
+                        <div class="col-sm-3">
+                            {!! Form::radio('active','0',null) !!} {{Lang::get('lang.inactive')}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="col-sm-4">
+                <!-- Role -->
+                <div class="form-group {{ $errors->has('role') ? 'has-error' : '' }}">
+                    {!! Form::label('role',Lang::get('lang.role')) !!}
+                    <div class="row">
+                        <div class="col-sm-3">
+                            {!! Form::radio('role','admin',true) !!} {{Lang::get('lang.admin')}}
+                        </div>
+                        <div class="col-sm-3">
+                            {!! Form::radio('role','agent',null) !!} {{Lang::get('lang.agent')}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-sm-4">
+                <!-- Assign team -->
+                <div class="form-group {{ $errors->has('team') ? 'has-error' : '' }}">
+                    {!! Form::label('agent_tzone',Lang::get('lang.assigned_team')) !!} <span class="text-red"> *</span>
+                    @foreach($teams as $key => $val)
+                    <div class="form-group ">
+                        <input type="checkbox" name="team[]" value="{!! $val !!}"  > {!! $key !!}<br/>
+                    </div>
+                    @endforeach
+                </div>
             </div>
-            @endforeach
         </div>
+
+        <div>
+            {!! Form::label('agent_signature',Lang::get('lang.agent_signature')) !!}
+            {!! Form::textarea('agent_sign',null,['class' => 'form-control','size' => '30x5']) !!}
+        </div>
+
         <!-- Send email to user about registration password -->
-        <br/>
-        <div class="form-group">
+        <div>
             <input type="checkbox" name="send_email" checked> &nbsp;<label> {{ Lang::get('lang.send_password_via_email')}}</label>
         </div>
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.submit'),['class'=>'form-group btn btn-primary'])!!}
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.submit'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
 {!!Form::close()!!}
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/agents/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/agents/edit.blade.php
index 49ab1cbcf..e975f1dc5 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/agents/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/agents/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('agents')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -33,72 +37,73 @@ class="active"
 <?php //dd($user->agent_tzone); ?>
 {!! Form::model($user, ['url' => 'agents/'.$user->id,'method' => 'PATCH'] )!!}
 
-<!-- <section class="content"> -->
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.edit_an_agent') !!}</h3>	
+@if(Session::has('errors'))
+<?php //dd($errors); ?>
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Alert!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('user_name'))
+    <li class="error-message-padding">{!! $errors->first('user_name', ':message') !!}</li>
+    @endif
+    @if($errors->first('first_name'))
+    <li class="error-message-padding">{!! $errors->first('first_name', ':message') !!}</li>
+    @endif
+    @if($errors->first('last_name'))
+    <li class="error-message-padding">{!! $errors->first('last_name', ':message') !!}</li>
+    @endif
+    @if($errors->first('email'))
+    <li class="error-message-padding">{!! $errors->first('email', ':message') !!}</li>
+    @endif
+    @if($errors->first('ext'))
+    <li class="error-message-padding">{!! $errors->first('ext', ':message') !!}</li>
+    @endif
+    @if($errors->first('phone_number'))
+    <li class="error-message-padding">{!! $errors->first('phone_number', ':message') !!}</li>
+    @endif
+    @if($errors->first('mobile'))
+    <li class="error-message-padding">{!! $errors->first('mobile', ':message') !!}</li>
+    @endif
+    @if($errors->first('active'))
+    <li class="error-message-padding">{!! $errors->first('active', ':message') !!}</li>
+    @endif
+    @if($errors->first('role'))
+    <li class="error-message-padding">{!! $errors->first('role', ':message') !!}</li>
+    @endif
+    @if($errors->first('group'))
+    <li class="error-message-padding">{!! $errors->first('group', ':message') !!}</li>
+    @endif
+    @if($errors->first('primary_department'))
+    <li class="error-message-padding">{!! $errors->first('primary_department', ':message') !!}</li>
+    @endif
+    @if($errors->first('agent_time_zone'))
+    <li class="error-message-padding">{!! $errors->first('agent_time_zone', ':message') !!}</li>
+    @endif
+    @if($errors->first('team'))
+    <li class="error-message-padding">{!! $errors->first('team', ':message') !!}</li>
+    @endif 
+</div>
+@endif
+@if(Session::has('fails2'))
+    <div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Alert!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+        <li class="error-message-padding">{!! Session::get('fails2') !!}</li>
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-        <?php //dd($errors); ?>
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>Alert!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-            @if($errors->first('user_name'))
-            <li class="error-message-padding">{!! $errors->first('user_name', ':message') !!}</li>
-            @endif
-            @if($errors->first('first_name'))
-            <li class="error-message-padding">{!! $errors->first('first_name', ':message') !!}</li>
-            @endif
-            @if($errors->first('last_name'))
-            <li class="error-message-padding">{!! $errors->first('last_name', ':message') !!}</li>
-            @endif
-            @if($errors->first('email'))
-            <li class="error-message-padding">{!! $errors->first('email', ':message') !!}</li>
-            @endif
-            @if($errors->first('ext'))
-            <li class="error-message-padding">{!! $errors->first('ext', ':message') !!}</li>
-            @endif
-            @if($errors->first('phone_number'))
-            <li class="error-message-padding">{!! $errors->first('phone_number', ':message') !!}</li>
-            @endif
-            @if($errors->first('mobile'))
-            <li class="error-message-padding">{!! $errors->first('mobile', ':message') !!}</li>
-            @endif
-            @if($errors->first('active'))
-            <li class="error-message-padding">{!! $errors->first('active', ':message') !!}</li>
-            @endif
-            @if($errors->first('role'))
-            <li class="error-message-padding">{!! $errors->first('role', ':message') !!}</li>
-            @endif
-            @if($errors->first('group'))
-            <li class="error-message-padding">{!! $errors->first('group', ':message') !!}</li>
-            @endif
-            @if($errors->first('primary_department'))
-            <li class="error-message-padding">{!! $errors->first('primary_department', ':message') !!}</li>
-            @endif
-            @if($errors->first('agent_time_zone'))
-            <li class="error-message-padding">{!! $errors->first('agent_time_zone', ':message') !!}</li>
-            @endif
-            @if($errors->first('team'))
-            <li class="error-message-padding">{!! $errors->first('team', ':message') !!}</li>
-            @endif 
-        </div>
-        @endif
-        @if(Session::has('fails2'))
-            <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>Alert!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-                <li class="error-message-padding">{!! Session::get('fails2') !!}</li>
-            </div>
-        @endif
+@endif
+<!-- <section class="content"> -->
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.edit_an_agent') !!}</h3>	
+    </div>
+    <div class="card-body">
+
         <div class="row">
             <!-- username -->
-            <div class="col-xs-4 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}">
 
                 {!! Form::label('user_name',Lang::get('lang.user_name')) !!} <span class="text-red"> *</span>
 
@@ -107,7 +112,7 @@ class="active"
             </div>
 
             <!-- firstname -->
-            <div class="col-xs-4 form-group {{ $errors->has('first_name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('first_name') ? 'has-error' : '' }}">
 
                 {!! Form::label('first_name',Lang::get('lang.first_name')) !!} <span class="text-red"> *</span>
 
@@ -116,7 +121,7 @@ class="active"
             </div>
 
             <!-- Lastname -->
-            <div class="col-xs-4 form-group {{ $errors->has('last_name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('last_name') ? 'has-error' : '' }}">
 
                 {!! Form::label('last_name',Lang::get('lang.last_name')) !!} <span class="text-red"> *</span>
 
@@ -128,7 +133,7 @@ class="active"
 
         <div class="row">
             <!-- Email -->
-            <div class="col-xs-4 form-group {{ $errors->has('email') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('email') ? 'has-error' : '' }}">
 
                 {!! Form::label('email',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
 
@@ -136,7 +141,7 @@ class="active"
 
             </div>
 
-            <div class="col-xs-1 form-group {{ $errors->has('ext') ? 'has-error' : '' }}">
+            <div class="col-sm-1 form-group {{ $errors->has('ext') ? 'has-error' : '' }}">
 
                 <label for="ext">EXT</label>	
 
@@ -144,14 +149,14 @@ class="active"
 
             </div>
             <!--country code-->
-            <div class="col-xs-1 form-group {{ Session::has('country_code') ? 'has-error' : '' }}">
+            <div class="col-sm-1 form-group {{ Session::has('country_code') ? 'has-error' : '' }}">
 
                 {!! Form::label('country_code',Lang::get('lang.country-code')) !!}
                 {!! Form::text('country_code',null,['class' => 'form-control', 'placeholder' => $phonecode, 'title' => Lang::get('lang.enter-country-phone-code')]) !!}
 
             </div>
             <!-- phone -->
-            <div class="col-xs-3 form-group {{ $errors->has('phone_number') ? 'has-error' : '' }}">
+            <div class="col-sm-3 form-group {{ $errors->has('phone_number') ? 'has-error' : '' }}">
 
                 {!! Form::label('phone_number',Lang::get('lang.phone')) !!}
 
@@ -160,7 +165,7 @@ class="active"
             </div>
 
             <!-- Mobile -->
-            <div class="col-xs-3 form-group {{ $errors->has('mobile') ? 'has-error' : '' }}">
+            <div class="col-sm-3 form-group {{ $errors->has('mobile') ? 'has-error' : '' }}">
 
                 {!! Form::label('mobile',Lang::get('lang.mobile_number')) !!}
 
@@ -169,138 +174,90 @@ class="active"
             </div>
 
         </div>
-        <!-- Agent signature -->
-        <div>
 
-            <h4>{{Lang::get('lang.agent_signature')}}</h4>
-
-        </div>
-
-        <div class="">
-
-            {!! Form::textarea('agent_sign',null,['class' => 'form-control','size' => '30x5']) !!}
-
-        </div>
-
-
-        <div>
-            <h4>{{Lang::get('lang.account_status_setting')}}</h4>
-        </div>
-        <div class="row">
-            <div class="col-xs-6">
-                <!-- acccount type -->
-                <div class="form-group {{ $errors->has('active') ? 'has-error' : '' }}">
-
-                    {!! Form::label('active',Lang::get('lang.status')) !!}
-
-                    <div class="row">
-                        <div class="col-xs-3">
-                            {!! Form::radio('active','1',true) !!} {{ Lang::get('lang.active') }}
-                        </div>
-                        <div class="col-xs-3">
-                            {!! Form::radio('active','0',null) !!} {{Lang::get('lang.inactive')}}
-                        </div>
-                    </div>
-
-                </div>
-                <!-- role -->
-                <div class="form-group {{ $errors->has('role') ? 'has-error' : '' }}">
-
-                    {!! Form::label('role',Lang::get('lang.role')) !!}
-
-                    <div class="row">
-                        <div class="col-xs-3">
-                            {!! Form::radio('role','admin',true) !!} {{Lang::get('lang.admin')}}
-                        </div>
-                        <div class="col-xs-3">
-                            {!! Form::radio('role','agent',null) !!} {{Lang::get('lang.agent')}}
-                        </div>
-                    </div>
-                </div>
-
-            </div>
-            <!-- day light saving -->
-            {{-- <div class="col-xs-6"> --}}
-
-            {{-- <div> --}}
-            {{-- <div class="row"> --}}
-            {{-- {!! Form::label('',Lang::get('lang.day_light_saving')) !!} --}}
-            {{-- <div class="col-xs-2"> --}}
-            {{-- {!! Form::checkbox('daylight_save',1,null,['class' => 'checkbox']) !!} --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-
-            <!-- limit access -->
-            {{-- <div > --}}
-            {{-- <div class="row"> --}}
-            {{-- {!! Form::label('limit_access',Lang::get('lang.limit_access')) !!} --}}
-            {{-- <div class="col-xs-2"> --}}
-            {{-- {!! Form::checkbox('limit_access',1,null,['class' => 'checkbox']) !!} --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-
-            <!-- directory listing -->
-            {{-- <div> --}}
-            {{-- <div class="row"> --}}
-            {{-- {!! Form::label('directory_listing',Lang::get('lang.directory_listing')) !!} --}}
-            {{-- <div class="col-xs-2"> --}}
-            {{-- {!! Form::checkbox('directory_listing',1,null,['class' => 'checkbox']) !!} --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-
-            <!-- vocation mode -->
-            {{-- <div> --}}
-            {{-- <div class="row"> --}}
-            {{-- {!! Form::label('vocation_mode',Lang::get('lang.vocation_mode')) !!} --}}
-            {{-- <div class="col-xs-2"> --}}
-            {{-- {!! Form::checkbox('vocation_mode',1,null,null,['class' => 'checkbox']) !!} --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-            {{-- </div> --}}
-        </div>
         <div class="row">
             <!-- assigned group -->
-            <div class="col-xs-4 form-group {{ $errors->has('group') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('group') ? 'has-error' : '' }}">
                 {!! Form::label('assign_group', Lang::get('lang.assigned_group')) !!} <span class="text-red"> *</span>
 
                 {!!Form::select('group',[''=>Lang::get('lang.select_a_group'), Lang::get('lang.groups')=>$groups->pluck('name','id')->toArray()],$user->assign_group,['class' => 'form-control select']) !!}
             </div>
 
             <!-- primary department -->
-            <div class="col-xs-4 form-group {{ $errors->has('primary_department') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('primary_department') ? 'has-error' : '' }}">
                 {!! Form::label('primary_dpt', Lang::get('lang.primary_department')) !!} <span class="text-red"> *</span>
 
                 {!!Form::select('primary_department', [''=>Lang::get('lang.select_a_department'), Lang::get('lang.departments')=>$departments->pluck('name','id')->toArray()],$user->primary_dpt,['class' => 'form-control select']) !!}
             </div>
 
             <!-- agent timezone -->
-            <div class="col-xs-4 form-group {{ $errors->has('agent_time_zone') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('agent_time_zone') ? 'has-error' : '' }}">
                 {!! Form::label('agent_tzone', Lang::get('lang.agent_time_zone')) !!} <span class="text-red"> *</span>
 
                 {!!Form::select('agent_time_zone', [''=>Lang::get('lang.select_a_time_zone'), Lang::get('lang.time_zones')=>$timezones->pluck('name','id')->toArray()],$user->agent_tzone,['class' => 'form-control select']) !!}
             </div>
         </div>
 
-        <!-- team -->
-        <div class="{{ $errors->has('team') ? 'has-error' : '' }}">
-            {!! Form::label('agent_tzone',Lang::get('lang.assigned_team')) !!} <span class="text-red"> *</span>
+        <div class="row">
+            <div class="col-sm-4">
+                <!-- acccount type -->
+                <div class="form-group {{ $errors->has('active') ? 'has-error' : '' }}">
+
+                    {!! Form::label('active',Lang::get('lang.status')) !!}
+
+                    <div class="row">
+                        <div class="col-sm-3">
+                            {!! Form::radio('active','1',true) !!} {{ Lang::get('lang.active') }}
+                        </div>
+                        <div class="col-sm-3">
+                            {!! Form::radio('active','0',null) !!} {{Lang::get('lang.inactive')}}
+                        </div>
+                    </div>
+
+                </div>
+            </div>
+
+            <div class="col-sm-4">
+                  <!-- role -->
+                <div class="form-group {{ $errors->has('role') ? 'has-error' : '' }}">
+
+                    {!! Form::label('role',Lang::get('lang.role')) !!}
+
+                    <div class="row">
+                        <div class="col-sm-3">
+                            {!! Form::radio('role','admin',true) !!} {{Lang::get('lang.admin')}}
+                        </div>
+                        <div class="col-sm-3">
+                            {!! Form::radio('role','agent',null) !!} {{Lang::get('lang.agent')}}
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <div class="col-sm-4">
+                <!-- team -->
+                <div class="form-group {{ $errors->has('team') ? 'has-error' : '' }}">
+                    {!! Form::label('agent_tzone',Lang::get('lang.assigned_team')) !!} <span class="text-red"> *</span>
+                </div>
+                @foreach($teams as $key => $val)
+                <div class="form-group ">
+                    <input type="checkbox" name="team[]" value="<?php echo $val; ?> " <?php
+                    if (in_array($val, $assign)) {
+                        echo ('checked');
+                    }
+                    ?> > &nbsp;<?php echo "  " . $key; ?><br/>
+                </div>
+                @endforeach
+            </div>
         </div>
-        @foreach($teams as $key => $val)
-        <div class="form-group ">
-            <input type="checkbox" name="team[]" value="<?php echo $val; ?> " <?php
-            if (in_array($val, $assign)) {
-                echo ('checked');
-            }
-            ?> > &nbsp;<?php echo "  " . $key; ?><br/>
+
+         <div>
+            {!! Form::label('agent_signature',Lang::get('lang.agent_signature')) !!}
+            {!! Form::textarea('agent_sign',null,['class' => 'form-control','size' => '30x5']) !!}
         </div>
-        @endforeach
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.update'),['class'=>'form-group btn btn-primary'])!!}
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.update'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
 {!!Form::close()!!}
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/agents/index.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/agents/index.blade.php
index b2deec39a..372025f2d 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/agents/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/agents/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('agents')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,40 +31,49 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="box box-primary">
-    <div class="box-header">
-        <h2 class="box-title">{!! Lang::get('lang.list_of_agents') !!} </h2><a href="{{route('agents.create')}}" class="btn btn-primary pull-right">
-        <span class="glyphicon glyphicon-plus"></span> &nbsp;{!! Lang::get('lang.create_an_agent') !!}</a></div>
-    <div class="box-body table-responsive">
+     <!-- check whether success or not -->
+@if(Session::has('success'))
+<div class="alert alert-success alert-dismissable">
+    <i class="fas  fa-check-circle"></i>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('success')}}
+</div>
+@endif
+<!-- failure message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fas fa-ban"></i>
+    <b>{!! Lang::get('lang.fails') !!}!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('fails')}}
+</div>
+@endif
+<!-- Warning Message -->
+@if(Session::has('warning'))
+<div class="alert alert-warning alert-dismissable">
+    <i class="fas fa-exclamation-triangle"></i>
+    <b>{!! Lang::get('lang.warning') !!}!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('warning')}}
+</div>
+@endif
+
+<div class="card card-light">
+    
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.list_of_agents') !!} </h3>
+
+        <div class="card-tools">
+                    
+            <a href="{{route('agents.create')}}" class="btn btn-default btn-tool">
+                <span class="fas fa-plus"></span> &nbsp;{!! Lang::get('lang.create_an_agent') !!}
+            </a>
+        </div>
+    </div>
+    <div class="card-body">
         <?php
         $user = App\User::where('role', '!=', 'user')->orderBy('id', 'ASC')->paginate(10);
         ?>
-        <!-- check whether success or not -->
-        @if(Session::has('success'))
-        <div class="alert alert-success alert-dismissable">
-            <i class="fa  fa-check-circle"></i>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('success')}}
-        </div>
-        @endif
-        <!-- failure message -->
-        @if(Session::has('fails'))
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>{!! Lang::get('lang.fails') !!}!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('fails')}}
-        </div>
-        @endif
-        <!-- Warning Message -->
-        @if(Session::has('warning'))
-        <div class="alert alert-warning alert-dismissable">
-            <i class="fa fa-warning"></i>
-            <b>{!! Lang::get('lang.warning') !!}!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('warning')}}
-        </div>
-        @endif
         <!-- Agent table -->
         <table class="table table-bordered dataTable" style="overflow:hidden;">
             <tr>
@@ -102,16 +115,16 @@ class="active"
                 {{-- <td>{{$use->Lastlogin_at}}</td> --}}
                 <td>
                     {!! Form::open(['route'=>['agents.destroy', $use->id],'method'=>'DELETE']) !!}
-                    <a href="{{route('agents.edit', $use->id)}}" class="btn btn-info btn-xs btn-flat"><i class="fa fa-edit" style="color:black;"> </i> {!! Lang::get('lang.edit') !!} </a>
+                    <a href="{{route('agents.edit', $use->id)}}" class="btn btn-primary btn-xs"><i class="fas fa-edit"> </i> {!! Lang::get('lang.edit') !!} </a>
                     <!-- To pop up a confirm Message -->
-                    {{-- {!! Form::button(' <i class="fa fa-trash" style="color:black;"> </i> '  . Lang::get('lang.delete') ,['type' => 'submit', 'class'=> 'btn btn-warning btn-xs btn-flat','onclick'=>'return confirm("Are you sure?")']) !!} --}}
+                    {{-- {!! Form::button(' <i class="fas fa-trash"> </i> '  . Lang::get('lang.delete') ,['type' => 'submit', 'class'=> 'btn btn-danger btn-xs','onclick'=>'return confirm("Are you sure?")']) !!} --}}
                     {!! Form::close() !!}
                 </td>
             </tr>
             @endif
             @endforeach
         </table>
-        <div class="pull-right" style="margin-top : -10px; margin-bottom : -10px;">
+        <div class="float-right">
             {!! $user->links() !!}
         </div>
     </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/departments/create.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/departments/create.blade.php
index 0c865769b..2b6f27e9b 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/departments/create.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/departments/create.blade.php
@@ -1,18 +1,21 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('departments')
-class="active"
+class="nav-link active"
 @stop
 
-
 @section('HeadInclude')
 @stop
 <!-- header -->
@@ -31,49 +34,49 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!! Form::open(array('action' => 'Admin\helpdesk\DepartmentController@store' , 'method' => 'post') )!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.create_a_department') !!}</h3>	
+@if(Session::has('errors'))
+<?php //dd($errors); ?>
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Alert!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('name'))
+    <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
+    @endif
+    @if($errors->first('account_status'))
+    <li class="error-message-padding">{!! $errors->first('account_status', ':message') !!}</li>
+    @endif
+    @if($errors->first('sla'))
+    <li class="error-message-padding">{!! $errors->first('sla', ':message') !!}</li>
+    @endif
+    @if($errors->first('manager'))
+    <li class="error-message-padding">{!! $errors->first('manager', ':message') !!}</li>
+    @endif
+    @if($errors->first('outgoing_email'))
+    <li class="error-message-padding">{!! $errors->first('outgoing_email', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.create_a_department') !!}</h3>	
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-        <?php //dd($errors); ?>
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>Alert!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-            @if($errors->first('name'))
-            <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
-            @endif
-            @if($errors->first('account_status'))
-            <li class="error-message-padding">{!! $errors->first('account_status', ':message') !!}</li>
-            @endif
-            @if($errors->first('sla'))
-            <li class="error-message-padding">{!! $errors->first('sla', ':message') !!}</li>
-            @endif
-            @if($errors->first('manager'))
-            <li class="error-message-padding">{!! $errors->first('manager', ':message') !!}</li>
-            @endif
-            @if($errors->first('outgoing_email'))
-            <li class="error-message-padding">{!! $errors->first('outgoing_email', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
+    <div class="card-body">
         <div class="row">
             <!-- name -->
-            <div class="col-xs-6 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
                 {!! Form::label('name',Lang::get('lang.name')) !!}  <span class="text-red"> *</span>
                 {!! Form::text('name',null,['class' => 'form-control']) !!}
             </div>
             <!-- account status -->
-            <div class="col-xs-6 form-group {{ $errors->has('account_status') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('account_status') ? 'has-error' : '' }}">
                 {!! Form::label('type',Lang::get('lang.type')) !!}
                 <div class="row">
-                    <div class="col-xs-2">
+                    <div class="col-sm-2">
                         {!! Form::radio('type','1',true) !!} {{Lang::get('lang.public')}}
                     </div>
-                    <div class="col-xs-3">
+                    <div class="col-sm-3">
                         {!! Form::radio('type','0',null) !!} {{Lang::get('lang.private')}}
                     </div>
                 </div>
@@ -81,34 +84,30 @@ class="active"
         </div>
         <div class="row">
             <!-- slaplan -->
-            <div class="col-xs-6 form-group {{ $errors->has('sla') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('sla') ? 'has-error' : '' }}">
                 {!! Form::label('sla',Lang::get('lang.SLA_plan')) !!}
                 {!!Form::select('sla', [''=>Lang::get('lang.select_a_sla'), Lang::get('lang.sla_plans')=>$slas->pluck('grace_period','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
             <!-- manager -->
-            <div class="col-xs-6 form-group {{ $errors->has('manager') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('manager') ? 'has-error' : '' }}">
                 {!! Form::label('manager',Lang::get('lang.manager')) !!}
                 {!!Form::select('manager',[''=>Lang::get('lang.select_a_manager'),Lang::get('lang.manager')=>$user->pluck('full_name','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
         </div>
-    </div>
-    <div class="box-header with-border">
-        <h4 class="box-title">{!! Lang::get('lang.outgoing_email_settings') !!}</h4>
-    </div>
-    <div class="box-body">
+
         <div class="row">
             <!-- sla -->
-            <div class="col-xs-6 form-group {{ $errors->has('outgoing_email') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('outgoing_email') ? 'has-error' : '' }}">
                 {!! Form::label('outgoing_email',Lang::get('lang.outgoing_email')) !!}
                 {!!Form::select('outgoing_email', ['' => Lang::get('lang.system_default'), Lang::get('lang.emails')=>$emails->pluck('email_name','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
         </div>
-        <div class="form-group">
+        <div>
             <input type="checkbox" name="sys_department"> {{ Lang::get('lang.make-default-department')}}
         </div>
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.submit'),['class'=>'form-group btn btn-primary'])!!}    
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.submit'),['class'=>'btn btn-primary'])!!}    
     </div>
     {!!Form::close()!!}
 </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/departments/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/departments/edit.blade.php
index 42000a62b..559004039 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/departments/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/departments/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('departments')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -31,49 +35,50 @@ class="active"
 
 <!-- open a form -->
 {!!Form::model($departments, ['url'=>'departments/'.$departments->id , 'method'=> 'PATCH'])!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.edit_department') !!}</h3>
+@if(Session::has('errors'))
+<?php //dd($errors); ?>
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Alert!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('name'))
+    <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
+    @endif
+    @if($errors->first('account_status'))
+    <li class="error-message-padding">{!! $errors->first('account_status', ':message') !!}</li>
+    @endif
+    @if($errors->first('sla'))
+    <li class="error-message-padding">{!! $errors->first('sla', ':message') !!}</li>
+    @endif
+    @if($errors->first('manager'))
+    <li class="error-message-padding">{!! $errors->first('manager', ':message') !!}</li>
+    @endif
+    @if($errors->first('outgoing_email'))
+    <li class="error-message-padding">{!! $errors->first('outgoing_email', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.edit_department') !!}</h3>
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-        <?php //dd($errors); ?>
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>Alert!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-            @if($errors->first('name'))
-            <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
-            @endif
-            @if($errors->first('account_status'))
-            <li class="error-message-padding">{!! $errors->first('account_status', ':message') !!}</li>
-            @endif
-            @if($errors->first('sla'))
-            <li class="error-message-padding">{!! $errors->first('sla', ':message') !!}</li>
-            @endif
-            @if($errors->first('manager'))
-            <li class="error-message-padding">{!! $errors->first('manager', ':message') !!}</li>
-            @endif
-            @if($errors->first('outgoing_email'))
-            <li class="error-message-padding">{!! $errors->first('outgoing_email', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
+    <div class="card-body">
+        
         <div class="row">
             <!-- name -->
-            <div class="col-xs-6 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
                 {!! Form::label('name',Lang::get('lang.name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('name',null,['class' => 'form-control']) !!}
             </div>
             <!-- account status -->
-            <div class="col-xs-6 form-group {{ $errors->has('account_status') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('account_status') ? 'has-error' : '' }}">
                 {!! Form::label('type',Lang::get('lang.type')) !!}
                 <div class="row">
-                    <div class="col-xs-2">
+                    <div class="col-sm-2">
                         {!! Form::radio('type','1',true) !!} {{Lang::get('lang.public')}}
                     </div>
-                    <div class="col-xs-3">
+                    <div class="col-sm-3">
                         {!! Form::radio('type','0',null) !!} {{Lang::get('lang.private')}}
                     </div>
                 </div>
@@ -81,36 +86,32 @@ class="active"
         </div>
         <div class="row">
             <!-- sla -->
-            <div class="col-xs-6 form-group {{ $errors->has('sla') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('sla') ? 'has-error' : '' }}">
                 {!! Form::label('sla',Lang::get('lang.SLA_plan')) !!}
                 {!!Form::select('sla', [''=>Lang::get('lang.select_a_sla'), Lang::get('lang.sla_plans')=>$slas->pluck('grace_period','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
             <!-- manager -->
-            <div class="col-xs-6 form-group {{ $errors->has('manager') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('manager') ? 'has-error' : '' }}">
                 {!! Form::label('manager',Lang::get('lang.manager')) !!}
                 {!!Form::select('manager',[null=>Lang::get('lang.select_a_manager'),Lang::get('lang.manager')=>$user->pluck('full_name','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
         </div>
-    </div>
-    <div class="box-header with-border">
-        <h4 class="box-title">{!! Lang::get('lang.outgoing_email_settings') !!}</h4>
-    </div>
-    <div class="box-body">
+
         <div class="row">
             <!-- sla -->
-            <div class="col-xs-6 form-group {{ $errors->has('outgoing_email') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('outgoing_email') ? 'has-error' : '' }}">
                 {!! Form::label('outgoing_email',Lang::get('lang.outgoing_email')) !!}
                 {!!Form::select('outgoing_email', ['' => Lang::get('lang.system_default'), Lang::get('lang.emails')=>$emails->pluck('email_name','id')->toArray()],null,['class' => 'form-control select']) !!}
             </div>
         </div>
-        <div class="form-group">
+        <div>
             <input type="checkbox" name="sys_department" @if($sys_department->department == $departments->id) checked disabled @endif> {{ Lang::get('lang.make-default-department')}}
         </div>
     </div>
 
-    <div class="box-footer">
+    <div class="card-footer">
 
-        {!! Form::submit(Lang::get('lang.update'),['class'=>'form-group btn btn-primary'])!!}    
+        {!! Form::submit(Lang::get('lang.update'),['class'=>'btn btn-primary'])!!}    
     </div>
     {!!Form::close()!!}
 </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/departments/index.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/departments/index.blade.php
index 56fcc1312..f42cdd550 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/departments/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/departments/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('departments')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -28,29 +32,41 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="box box-primary">
-    <div class="box-header">
-        <h2 class="box-title">{!! Lang::get('lang.list_of_departments') !!}</h2><a href="{{route('departments.create')}}" class="btn btn-primary pull-right"><span class="glyphicon glyphicon-plus"></span> &nbsp;{{Lang::get('lang.create_a_department')}}</a></div>
-    <div class="box-body table-responsive ">
-        <!-- check whether success or not -->
-        @if(Session::has('success'))
-        <div class="alert alert-success alert-dismissable">
-            <i class="fa  fa-check-circle"></i>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {!! Session::get('success') !!}
-        </div>
-        @endif
-        <!-- failure message -->
-        @if(Session::has('fails'))
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>{!! Lang::get('lang.fails') !!}!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {!! Session::get('fails') !!}
-        </div>
-        @endif
+
+<!-- check whether success or not -->
+@if(Session::has('success'))
+<div class="alert alert-success alert-dismissable">
+    <i class="fa  fa-check-circle"></i>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!! Session::get('success') !!}
+</div>
+@endif
+<!-- failure message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>{!! Lang::get('lang.fails') !!}!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!! Session::get('fails') !!}
+</div>
+@endif
+
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.list_of_departments') !!}</h3>
+
+        <div class="card-tools">
+            
+            <a href="{{route('departments.create')}}" class="btn btn-default btn-tool">
+                <span class="fas fa-plus"></span>&nbsp;{{Lang::get('lang.create_a_department')}}
+            </a>        
+        </div>    
+    </div>
+
+    <div class="card-body">
+       
         <!-- table -->
-        <table class="table table-bordered dataTable" style="overflow:hidden;">
+        <table class="table table-bordered dataTable" style="overflow:scroll;">
             <tr>
                 <th>{{Lang::get('lang.name')}}</th>
                 <th>{{Lang::get('lang.type')}}</th>
@@ -103,15 +119,23 @@ class="active"
                 <td>{{ $manager }}</td>
                 <td>
                     {!! Form::open(['route'=>['departments.destroy', $department->id],'method'=>'DELETE']) !!}
-                    <a href="{{route('departments.edit', $department->id)}}" class="btn btn-info btn-xs btn-flat"><i class="fa fa-edit" style="color:black;"> </i> {!! Lang::get('lang.edit') !!}</a>
+                    <a href="{{route('departments.edit', $department->id)}}" class="btn btn-primary btn-xs"><i class="fas fa-edit"> </i> {!! Lang::get('lang.edit') !!}</a>
                     {{-- @if($default_department == $department->id) --}}
                     {{-- @else --}}
                     <!-- To pop up a confirm Message -->
-                    {!! Form::button('<i class="fa fa-trash" style="color:black;"> </i> '.Lang::get('lang.delete'),
+                   
+                    @if($default_department == $department->id)
+                    {!! Form::button('<i class="fas fa-trash"> </i> '.Lang::get('lang.delete'),
+                    ['class'=> 'btn btn-danger btn-xs '.$disable])
+                    !!}
+                    @else
+                     {!! Form::button('<i class="fas fa-trash"> </i> '.Lang::get('lang.delete'),
                     ['type' => 'submit',
-                    'class'=> 'btn btn-warning btn-xs btn-flat '.$disable,
+                    'class'=> 'btn btn-danger btn-xs',
                     'onclick'=>'return confirm("Are you sure?")'])
                     !!}
+                    @endif
+
                     {{-- @endif --}}
 
                     {!! Form::close() !!}
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/groups/create.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/groups/create.blade.php
index b2259c632..53abd703e 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/groups/create.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/groups/create.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('groups')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -30,96 +34,94 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!! Form::open(array('action' => 'Admin\helpdesk\GroupController@store' , 'method' => 'post') )!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title"> {{Lang::get('lang.create_a_group')}} </h3> 
+@if(Session::has('errors'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fas fa-ban"></i>
+    <b> {!! Lang::get('lang.alert') !!}</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('name'))
+    <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
+    @endif
+    @if($errors->first('group_status'))
+    <li class="error-message-padding">{!! $errors->first('group_status', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title"> {{Lang::get('lang.create_a_group')}} </h3> 
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b> {!! Lang::get('lang.alert') !!}</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-            @if($errors->first('name'))
-            <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
-            @endif
-            @if($errors->first('group_status'))
-            <li class="error-message-padding">{!! $errors->first('group_status', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
+    <div class="card-body">
+        
         <div class="row">
             <!-- name -->
-            <div class="col-xs-4 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
                 {!! Form::label('name',Lang::get('lang.name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('name',null,['class' => 'form-control']) !!}
             </div>
             <!-- group status -->
-            <div class="col-xs-6 form-group {{ $errors->has('group_status') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('group_status') ? 'has-error' : '' }}">
                 {!! Form::label('group_status',Lang::get('lang.status')) !!}
                 <div class="row">
-                    <div class="col-xs-2">
+                    <div class="col-sm-2">
                         {!! Form::radio('group_status','1',true) !!} {{Lang::get('lang.active')}}
                     </div>
-                    <div class="col-xs-3">
+                    <div class="col-sm-3">
                         {!! Form::radio('group_status','0',null) !!} {{Lang::get('lang.inactive')}}
                     </div>
                 </div>
             </div>
         </div>
-        <!-- can create ticket -->
-        <div class="row">
-            {!! Form::label('can_create_ticket',Lang::get('lang.can_create_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_create_ticket',1,null,['class' => 'checkbox']) !!}
+
+        <div class="card card-light">
+            
+            <div class="card-header">
+                
+                <h3 class="card-title">Permissions</h3>
             </div>
-        </div>
-        <!-- can_edit_ticket -->
-        <div class="row">
-            {!! Form::label('can_edit_ticket',Lang::get('lang.can_edit_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_edit_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can post ticket -->
-        <div class="row">
-            {!! Form::label('can_post_ticket',Lang::get('lang.can_post_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_post_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can_close_ticket -->
-        <div class="row">
-            {!! Form::label('can_close_ticket',Lang::get('lang.can_close_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_close_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can delete ticket -->
-        <div class="row">
-            {!! Form::label('can_delete_ticket',Lang::get('lang.can_delete_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_delete_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can assign ticket -->
-        <div class="row">
-            {!! Form::label('can_assign_ticket',Lang::get('lang.can_assign_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_assign_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can ban email -->
-        <div class="row">
-            {!! Form::label('can_ban_email',Lang::get('lang.can_ban_emails')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_ban_email',1,null,['class' => 'checkbox']) !!}
+
+            <div class="card-body">
+                <!-- can create ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_create_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_create_ticket',Lang::get('lang.can_create_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can_edit_ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_edit_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_edit_ticket',Lang::get('lang.can_edit_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can post ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_post_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_post_ticket',Lang::get('lang.can_post_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can_close_ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_close_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_close_ticket',Lang::get('lang.can_close_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can delete ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_delete_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_delete_ticket',Lang::get('lang.can_delete_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can assign ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_assign_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_assign_ticket',Lang::get('lang.can_assign_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can ban email -->
+                <div class="row">
+                    {!! Form::checkbox('can_ban_email',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_ban_email',Lang::get('lang.can_ban_emails'),['style' => 'line-height:1;']) !!}
+                </div>
             </div>
         </div>
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.submit'),['class'=>'form-group btn btn-primary'])!!}
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.submit'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
 {!!Form::close()!!}
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/groups/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/groups/edit.blade.php
index ebaece267..e6dbcae0c 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/groups/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/groups/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('groups')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -29,96 +33,93 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!!Form::model($groups, ['url'=>'groups/'.$groups->id , 'method'=> 'PATCH'])!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title"> {{Lang::get('lang.edit_a_group')}}</h3>
+@if(Session::has('errors'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>{!! Lang::get('lang.alert') !!}!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('name'))
+    <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
+    @endif
+    @if($errors->first('group_status'))
+    <li class="error-message-padding">{!! $errors->first('group_status', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title"> {{Lang::get('lang.edit_a_group')}}</h3>
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>{!! Lang::get('lang.alert') !!}!</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <br/>
-            @if($errors->first('name'))
-            <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
-            @endif
-            @if($errors->first('group_status'))
-            <li class="error-message-padding">{!! $errors->first('group_status', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
+    <div class="card-body">
         <div class="row">
             <!-- name -->
-            <div class="col-xs-4 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
                 {!! Form::label('name',Lang::get('lang.name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('name',null,['class' => 'form-control']) !!}
             </div>
             <!-- group status -->
-            <div class="col-xs-6 form-group {{ $errors->has('group_status') ? 'has-error' : '' }}">
+            <div class="col-sm-6 form-group {{ $errors->has('group_status') ? 'has-error' : '' }}">
                 {!! Form::label('group_status',Lang::get('lang.status')) !!}
                 <div class="row">
-                    <div class="col-xs-2">
+                    <div class="col-sm-2">
                         {!! Form::radio('group_status','1',true) !!} {{Lang::get('lang.active')}}
                     </div>
-                    <div class="col-xs-3">
+                    <div class="col-sm-3">
                         {!! Form::radio('group_status','0',null) !!} {{Lang::get('lang.inactive')}}
                     </div>
                 </div>
             </div>
         </div>
-        <!-- can create ticket -->
-        <div class="row">
-            {!! Form::label('can_create_ticket',Lang::get('lang.can_create_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_create_ticket',1,null,['class' => 'checkbox']) !!}
+
+        <div class="card card-light">
+            
+            <div class="card-header">
+                
+                <h3 class="card-title">Permissions</h3>
             </div>
-        </div>
-        <!-- can_edit_ticket -->
-        <div class="row">
-            {!! Form::label('can_edit_ticket',Lang::get('lang.can_edit_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_edit_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can post ticket -->
-        <div class="row">
-            {!! Form::label('can_post_ticket',Lang::get('lang.can_post_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_post_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can_close_ticket -->
-        <div class="row">
-            {!! Form::label('can_close_ticket',Lang::get('lang.can_close_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_close_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can delete ticket -->
-        <div class="row">
-            {!! Form::label('can_delete_ticket',Lang::get('lang.can_delete_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_delete_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can assign ticket -->
-        <div class="row">
-            {!! Form::label('can_assign_ticket',Lang::get('lang.can_assign_ticket')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_assign_ticket',1,null,['class' => 'checkbox']) !!}
-            </div>
-        </div>
-        <!-- can ban email -->
-        <div class="row">
-            {!! Form::label('can_ban_email',Lang::get('lang.can_ban_emails')) !!}
-            <div class="col-xs-1">
-                {!! Form::checkbox('can_ban_email',1,null,['class' => 'checkbox']) !!}
+
+            <div class="card-body">
+                <!-- can create ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_create_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_create_ticket',Lang::get('lang.can_create_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can_edit_ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_edit_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_edit_ticket',Lang::get('lang.can_edit_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can post ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_post_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_post_ticket',Lang::get('lang.can_post_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can_close_ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_close_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_close_ticket',Lang::get('lang.can_close_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can delete ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_delete_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_delete_ticket',Lang::get('lang.can_delete_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can assign ticket -->
+                <div class="row">
+                    {!! Form::checkbox('can_assign_ticket',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_assign_ticket',Lang::get('lang.can_assign_ticket'),['style' => 'line-height:1;']) !!}
+                </div>
+                <!-- can ban email -->
+                <div class="row">
+                     {!! Form::checkbox('can_ban_email',1,null,['class' => 'checkbox']) !!}
+                    &nbsp;{!! Form::label('can_ban_email',Lang::get('lang.can_ban_emails'),['style' => 'line-height:1;']) !!}
+                </div>
             </div>
         </div>
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.update'),['class'=>'form-group btn btn-primary'])!!}
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.update'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
 {!!Form::close()!!}
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/groups/index.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/groups/index.blade.php
index 94802437a..9daf8e43f 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/groups/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/groups/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('groups')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,61 +31,68 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="row">
-    <div class="col-md-12">
-        <div class="box box-primary">
-            <div class="box-header">
-                <h2 class="box-title">{!! Lang::get('lang.list_of_groups') !!}</h2><a href="{{route('groups.create')}}" class="btn btn-primary pull-right"><span class="glyphicon glyphicon-plus"></span> &nbsp;{{Lang::get('lang.create_group')}}</a></div>
-            <div class="box-body table-responsive">
-                <!-- check whether success or not -->
-                @if(Session::has('success'))
-                <div class="alert alert-success alert-dismissable">
-                    <i class="fa  fa-check-circle"></i>
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    {!! Session::get('success') !!}
-                </div>
-                @endif
-                <!-- failure message -->
-                @if(Session::has('fails'))
-                <div class="alert alert-danger alert-dismissable">
-                    <i class="fa fa-ban"></i>
-                    <b>Fail!</b>
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    {!! Session::get('fails') !!}
-                </div>
-                @endif
-                <!-- Table -->
-                <table class="table table-bordered dataTable" style="overflow:hidden;">
-                    <tr>
-                        <th>{{Lang::get('lang.group_name')}}</th>
-                        <th>{{Lang::get('lang.status')}}</th>
-                        <th>{{Lang::get('lang.action')}}</th>
-                    </tr>
-                    @foreach($groups as $group)
-                    <tr>
-                        <td><a href="{{route('groups.edit', $group->id)}}"> {{$group -> name }}</a></td>
-                        <td>
-                            @if($group->group_status=='1')
-                            <span style="color:green">{{'Active'}}</span>
-                            @else
-                            <span style="color:red">{{'Inactive'}}</span>
-                            @endif
-                        <td>
-                            {!! Form::open(['route'=>['groups.destroy', $group->id],'method'=>'DELETE']) !!}
-                            <a href="{{route('groups.edit', $group->id)}}" class="btn btn-info btn-xs btn-flat"><i class="fa fa-edit" style="color:black;"> </i> Edit</a>
-                            <!-- To pop up a confirm Message -->
-                            {!! Form::button('<i class="fa fa-trash" style="color:black;"> </i> Delete',
-                            ['type' => 'submit',
-                            'class'=> 'btn btn-warning btn-xs btn-flat',
-                            'onclick'=>'return confirm("Are you sure?")'])
-                            !!}
-                            {!! Form::close() !!}
-                        </td>
-                    </tr>
-                    @endforeach
-                </table>
-            </div>
+
+<!-- check whether success or not -->
+@if(Session::has('success'))
+<div class="alert alert-success alert-dismissable">
+    <i class="fa  fa-check-circle"></i>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!! Session::get('success') !!}
+</div>
+@endif
+<!-- failure message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Fail!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!! Session::get('fails') !!}
+</div>
+@endif
+
+<div class="card card-light">
+
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.list_of_groups') !!}</h3>
+        <div class="card-tools">
+            <a href="{{route('groups.create')}}" class="btn btn-default btn-tool">
+                <span class="fas fa-plus"></span>&nbsp;{{Lang::get('lang.create_group')}}
+            </a>        
         </div>
     </div>
+
+    <div class="card-body">
+        
+        <!-- Table -->
+        <table class="table table-bordered dataTable" style="overflow:scroll;">
+            <tr>
+                <th>{{Lang::get('lang.group_name')}}</th>
+                <th>{{Lang::get('lang.status')}}</th>
+                <th>{{Lang::get('lang.action')}}</th>
+            </tr>
+            @foreach($groups as $group)
+            <tr>
+                <td><a href="{{route('groups.edit', $group->id)}}"> {{$group -> name }}</a></td>
+                <td>
+                    @if($group->group_status=='1')
+                    <span style="color:green">{{'Active'}}</span>
+                    @else
+                    <span style="color:red">{{'Inactive'}}</span>
+                    @endif
+                <td>
+                    {!! Form::open(['route'=>['groups.destroy', $group->id],'method'=>'DELETE']) !!}
+                    <a href="{{route('groups.edit', $group->id)}}" class="btn btn-primary btn-xs"><i class="fas fa-edit"> </i> Edit</a>
+                    <!-- To pop up a confirm Message -->
+                    {!! Form::button('<i class="fas fa-trash"> </i> Delete',
+                    ['type' => 'submit',
+                    'class'=> 'btn btn-danger btn-xs',
+                    'onclick'=>'return confirm("Are you sure?")'])
+                    !!}
+                    {!! Form::close() !!}
+                </td>
+            </tr>
+            @endforeach
+        </table>
+    </div>
 </div>
 @stop
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/teams/create.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/teams/create.blade.php
index 9203e9569..76eaefd51 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/teams/create.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/teams/create.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('teams')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -30,60 +34,68 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!! Form::open(array('action' => 'Admin\helpdesk\TeamController@store' , 'method' => 'post') )!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.create_a_team') !!}	</h3>
-    </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-            <div class="alert alert-danger alert-dismissable">
-                <i class="fa fa-ban"></i>
-                <b>Alert!</b>
-                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                <br/>
-                @if($errors->first('name'))
-                <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
-                @endif
-                @if($errors->first('team_lead'))
-                <li class="error-message-padding">{!! $errors->first('team_lead', ':message') !!}</li>
-                @endif
-                @if($errors->first('status'))
-                <li class="error-message-padding">{!! $errors->first('status', ':message') !!}</li>
-                @endif
-            </div>
+
+@if(Session::has('errors'))
+    <div class="alert alert-danger alert-dismissable">
+        <i class="fa fa-ban"></i>
+        <b>Alert!</b>
+        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+        <br/>
+        @if($errors->first('name'))
+        <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
         @endif
+        @if($errors->first('team_lead'))
+        <li class="error-message-padding">{!! $errors->first('team_lead', ':message') !!}</li>
+        @endif
+        @if($errors->first('status'))
+        <li class="error-message-padding">{!! $errors->first('status', ':message') !!}</li>
+        @endif
+    </div>
+@endif
+
+<div class="card card-light">
+    
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.create_a_team') !!}	</h3>
+    </div>
+
+    <div class="card-body">
+
         <div class="row">
             <!-- name -->
-            <div class="col-xs-6 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+            <div class="col-sm-5 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
                 {!! Form::label('name',Lang::get('lang.name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('name',null,['class' => 'form-control']) !!}
             </div>
             <!-- team lead -->
-            <div class="col-xs-6 form-group {{ $errors->has('team_lead') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('team_lead') ? 'has-error' : '' }}">
                 {!! Form::label('team_lead',Lang::get('lang.team_lead')) !!} 
                 {!! Form::select('team_lead',[''=>Lang::get('lang.select_a_team_lead'), Lang::get('lang.members')=>$user->pluck('full_name','id')->toArray()],null,['class' => 'form-control']) !!}	
             </div>
-        </div>
-        <!-- status -->
-        <div class="form-group {{ $errors->has('status') ? 'has-error' : '' }}">
-            {!! Form::label('status',Lang::get('lang.status')) !!}
-            <div class="row">
-                <div class="col-xs-1">
-                    {!! Form::radio('status','1',true) !!} {{Lang::get('lang.active')}}
-                </div>
-                <div class="col-xs-2">
-                    {!! Form::radio('status','0',null) !!} {{Lang::get('lang.inactive')}}
+
+            <div class="col-sm-3">
+                <!-- status -->
+                <div class="form-group {{ $errors->has('status') ? 'has-error' : '' }}">
+                    {!! Form::label('status',Lang::get('lang.status')) !!}
+                    <div class="row">
+                        <div class="col-sm-6">
+                            {!! Form::radio('status','1',true) !!} {{Lang::get('lang.active')}}
+                        </div>
+                        <div class="col-sm-6">
+                            {!! Form::radio('status','0',null) !!} {{Lang::get('lang.inactive')}}
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
         <!-- admin notes -->
-        <div class="form-group">
+        <div>
             {!! Form::label('admin_notes',Lang::get('lang.admin_notes')) !!}
             {!! Form::textarea('admin_notes',null,['class' => 'form-control','size' => '30x5']) !!}
         </div>
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.submit'),['class'=>'form-group btn btn-primary'])!!}
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.submit'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
 {!!Form::close()!!}
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/teams/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/teams/edit.blade.php
index df441d8d8..caa676037 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/teams/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/teams/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('teams')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -29,60 +33,68 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!!Form::model($teams, ['url'=>'teams/'.$teams->id , 'method'=> 'PATCH'])!!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.edit_a_team') !!}</h3>	
+
+@if(Session::has('errors'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Alert!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <br/>
+    @if($errors->first('name'))
+    <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
+    @endif
+    @if($errors->first('team_lead'))
+    <li class="error-message-padding">{!! $errors->first('team_lead', ':message') !!}</li>
+    @endif
+    @if($errors->first('status'))
+    <li class="error-message-padding">{!! $errors->first('status', ':message') !!}</li>
+    @endif
+</div>
+@endif
+
+<div class="card card-light">
+
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.edit_a_team') !!}</h3>	
     </div>
-    <div class="box-body">
-        @if(Session::has('errors'))
-            <div class="alert alert-danger alert-dismissable">
-                <i class="fa fa-ban"></i>
-                <b>Alert!</b>
-                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                <br/>
-                @if($errors->first('name'))
-                <li class="error-message-padding">{!! $errors->first('name', ':message') !!}</li>
-                @endif
-                @if($errors->first('team_lead'))
-                <li class="error-message-padding">{!! $errors->first('team_lead', ':message') !!}</li>
-                @endif
-                @if($errors->first('status'))
-                <li class="error-message-padding">{!! $errors->first('status', ':message') !!}</li>
-                @endif
-            </div>
-        @endif
+    
+    <div class="card-body">
+       
         <div class="row">
             <!-- name -->
-            <div class="col-xs-6 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+            <div class="col-sm-5 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
                 {!! Form::label('name',Lang::get('lang.name')) !!} <span class="text-red"> *</span>
                 {!! Form::text('name',null,['class' => 'form-control']) !!}
             </div>
             <!-- team lead -->
-            <div class="col-xs-6 form-group {{ $errors->has('team_lead') ? 'has-error' : '' }}">
+            <div class="col-sm-4 form-group {{ $errors->has('team_lead') ? 'has-error' : '' }}">
                 {!! Form::label('team_lead',Lang::get('lang.team_lead')) !!}
                 {!! Form::select('team_lead',[''=>Lang::get('lang.select_a_team_lead'), Lang::get('lang.members')=>$user->pluck('full_name','id')->toArray()],null,['class' => 'form-control']) !!}	
             </div>
-        </div>
-        <!-- status -->
-        <div class="form-group {{ $errors->has('status') ? 'has-error' : '' }}">
-            {!! Form::label('status',Lang::get('lang.status')) !!}
-            <div class="row">
-                <div class="col-xs-1">
-                    {!! Form::radio('status','1',true) !!} {{Lang::get('lang.active')}}
-                </div>
-                <div class="col-xs-2">
-                    {!! Form::radio('status','0',null) !!} {{Lang::get('lang.inactive')}}
+
+            <div class="col-sm-3">
+                <!-- status -->
+                <div class="form-group {{ $errors->has('status') ? 'has-error' : '' }}">
+                    {!! Form::label('status',Lang::get('lang.status')) !!}
+                    <div class="row">
+                        <div class="col-sm-6">
+                            {!! Form::radio('status','1',true) !!} {{Lang::get('lang.active')}}
+                        </div>
+                        <div class="col-sm-6">
+                            {!! Form::radio('status','0',null) !!} {{Lang::get('lang.inactive')}}
+                        </div>
+                    </div>
                 </div>
             </div>
         </div>
         <!-- admin notes -->
-        <div class="form-group">
+        <div>
             {!! Form::label('admin_notes',Lang::get('lang.admin_notes')) !!}
             {!! Form::textarea('admin_notes',null,['class' => 'form-control','size' => '30x5']) !!}
         </div>
     </div>
-    <div class="box-footer">
-        {!! Form::submit(Lang::get('lang.update'),['class'=>'form-group btn btn-primary'])!!}
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.update'),['class'=>'btn btn-primary'])!!}
     </div>
     {!!Form::close()!!}
 </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/teams/index.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/teams/index.blade.php
index df143dc92..3b6f1a74d 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/teams/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/teams/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('teams')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,86 +31,93 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="row">
-    <div class="col-md-12">
-        <div class="box box-primary">
-            <div class="box-header">
-                <h2 class="box-title">{{Lang::get('lang.list_of_teams')}}</h2><a href="{{route('teams.create')}}" class="btn btn-primary pull-right"><span class="glyphicon glyphicon-plus"></span> &nbsp;{{Lang::get('lang.create_team')}}</a></div>
-            <div class="box-body table-responsive">
-                <!-- check whether success or not -->
-                @if(Session::has('success'))
-                <div class="alert alert-success alert-dismissable">
-                    <i class="fa  fa-check-circle"></i>
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    {{Session::get('success')}}
-                </div>
-                @endif
-                <!-- failure message -->
-                @if(Session::has('fails'))
-                <div class="alert alert-danger alert-dismissable">
-                    <i class="fa fa-ban"></i>
-                    <b>Fail!</b>
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    {{Session::get('fails')}}
-                </div>
-                @endif
-                <table class="table table-bordered dataTable" style="overflow:hidden;">
-                    <tr>
-                        <th>{{Lang::get('lang.name')}}</th>
-                        <th>{{Lang::get('lang.status')}}</th>
-                        <th>{{Lang::get('lang.team_members')}}</th>
-                        <th>{{Lang::get('lang.team_lead')}}</th>
-                        <th>{{Lang::get('lang.action')}}</th>
-                    </tr>
-                    @foreach($teams as $team)
-                    <tr>
-                        <td><a href="{{route('teams.show', $team->id)}}"> {{$team->name }}</a></td>
-                        <td>
-                            @if($team->status=='1')
-                            <span style="color:green">{{Lang::get('lang.active')}}</span>
-                            @else
-                            <span style="color:red">{{Lang::get('lang.inactive')}}</span>
-                            @endif
-                            <?php
-                            if ($team->team_lead == 0) {
-                                $team_lead = "";
-                            } else {
-                                $users = App\User::whereId($team->team_lead)->first();
-                                $team_lead = $users->full_name;
-                            }
-                            ?>
-                        <td>{{count($assign_team_agent->where('team_id',$team->id))}}</td>
-                        <td>{{ $team_lead }}</td>
-                        <td>
-                            {!! Form::open(['route'=>['teams.destroy', $team->id],'method'=>'DELETE']) !!}
+<!-- check whether success or not -->
+@if(Session::has('success'))
+<div class="alert alert-success alert-dismissable">
+    <i class="fa  fa-check-circle"></i>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('success')}}
+</div>
+@endif
+<!-- failure message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Fail!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('fails')}}
+</div>
+@endif
+<div class="card card-light">
 
-                            <!-- To pop up a confirm Message -->
-                           @if ($team->status == 0) 
-                            <a href="{{route('teams.show', $team->id)}}" class="btn btn-success btn-xs btn-flat" disabled='disabled'><i class="fa fa-edit" style="color:black;"> </i> {!! Lang::get('lang.show') !!}</a>
-                            
-                            @endif
-                             @if ($team->status == 1) 
-                            <a href="{{route('teams.show', $team->id)}}" class="btn btn-success btn-xs btn-flat" ><i class="fa fa-edit" style="color:black;"> </i> {!! Lang::get('lang.show') !!}</a>
-                            
-                            @endif
+    <div class="card-header">
+        
+        <h3 class="card-title">{{Lang::get('lang.list_of_teams')}}</h3>
 
-                            <a href="{{route('teams.edit', $team->id)}}" class="btn btn-info btn-xs btn-flat"><i class="fa fa-edit" style="color:black;"> </i> {!! Lang::get('lang.edit') !!}</a>
-                            
-                            {!! Form::button('<i class="fa fa-trash" style="color:black;"> </i> '.Lang::get('lang.delete'),
-                            ['type' => 'submit',
-                            'class'=> 'btn btn-warning btn-xs btn-flat',
-                            'onclick'=>'return confirm("Are you sure?")'])
-                            !!}
-                            {!! Form::close() !!}
-                        </td>
-                    </tr>
-                    @endforeach
-                    </td>
-                    </tr>
-                </table>
-            </div>
+        <div class="card-tools">
+            
+            <a href="{{route('teams.create')}}" class="btn btn-default btn-tool">
+                <span class="fas fa-plus"></span>&nbsp;{{Lang::get('lang.create_team')}}
+            </a>        
         </div>
     </div>
+    
+    <div class="card-body">
+      
+        <table class="table table-bordered dataTable" style="overflow:scroll;">
+            <tr>
+                <th>{{Lang::get('lang.name')}}</th>
+                <th>{{Lang::get('lang.status')}}</th>
+                <th>{{Lang::get('lang.team_members')}}</th>
+                <th>{{Lang::get('lang.team_lead')}}</th>
+                <th>{{Lang::get('lang.action')}}</th>
+            </tr>
+            @foreach($teams as $team)
+            <tr>
+                <td><a href="{{route('teams.show', $team->id)}}"> {{$team->name }}</a></td>
+                <td>
+                    @if($team->status=='1')
+                    <span style="color:green">{{Lang::get('lang.active')}}</span>
+                    @else
+                    <span style="color:red">{{Lang::get('lang.inactive')}}</span>
+                    @endif
+                    <?php
+                    if ($team->team_lead == 0) {
+                        $team_lead = "";
+                    } else {
+                        $users = App\User::whereId($team->team_lead)->first();
+                        $team_lead = $users->full_name;
+                    }
+                    ?>
+                </td>
+                <td>{{count($assign_team_agent->where('team_id',$team->id))}}</td>
+                <td>{{ $team_lead }}</td>
+                <td>
+                    {!! Form::open(['route'=>['teams.destroy', $team->id],'method'=>'DELETE']) !!}
+
+                    <!-- To pop up a confirm Message -->
+                   @if ($team->status == 0) 
+                    <a href="{{route('teams.show', $team->id)}}" class="btn btn-success btn-xs" disabled='disabled'><i class="fas fa-eye"> </i> {!! Lang::get('lang.show') !!}</a>
+                    
+                    @endif
+                     @if ($team->status == 1) 
+                    <a href="{{route('teams.show', $team->id)}}" class="btn btn-success btn-xs" ><i class="fas fa-eye"> </i> {!! Lang::get('lang.show') !!}</a>
+                    
+                    @endif
+
+                    <a href="{{route('teams.edit', $team->id)}}" class="btn btn-primary btn-xs"><i class="fas fa-edit"> </i> {!! Lang::get('lang.edit') !!}</a>
+                    
+                    {!! Form::button('<i class="fas fa-trash"> </i> '.Lang::get('lang.delete'),
+                    ['type' => 'submit',
+                    'class'=> 'btn btn-danger btn-xs',
+                    'onclick'=>'return confirm("Are you sure?")'])
+                    !!}
+                    {!! Form::close() !!}
+                </td>
+            </tr>
+            @endforeach
+        </table>
+    </div>
 </div>
 
 @stop
\ No newline at end of file
diff --git a/resources/views/themes/default1/admin/helpdesk/agent/teams/show.blade.php b/resources/views/themes/default1/admin/helpdesk/agent/teams/show.blade.php
index 558be78c8..1303cccd2 100644
--- a/resources/views/themes/default1/admin/helpdesk/agent/teams/show.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/agent/teams/show.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Staffs')
-active
+class="nav-link active"
 @stop
 
-@section('staffs-bar')
-active
+@section('staff-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('staff-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('teams')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -28,25 +32,24 @@ class="active"
 <!-- content -->
 @section('content')
 
-
 @if(Session::has('success'))
-    <div class="alert alert-success alert-dismissable">
-        <i class="fa  fa-check-circle"></i>
-        <b>Success!</b>
-        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-        {!! Session::get('success') !!}
-    </div>
-    @endif
-    <!-- failure message -->
-    @if(Session::has('fails'))
-    <div class="alert alert-danger alert-dismissable">
-        <i class="fa fa-ban"></i>
-        <b>Fail!</b>
-        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-        {!! Session::get('fails') !!}
-    </div>
-    @endif
-<!-- <input type="text" name="show_id" value="{{$id}}"> -->
+<div class="alert alert-success alert-dismissable">
+    <i class="fas fa-check-circle"></i>
+    <b>Success!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!! Session::get('success') !!}
+</div>
+@endif
+<!-- failure message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <b>Fail!</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!! Session::get('fails') !!}
+</div>
+@endif
+
 <?php
  if($team_lead_name= App\User::whereId($teams->team_lead)->first())
           {
@@ -54,41 +57,37 @@ class="active"
              // $assign_team_agent=App\Model\helpdesk\Agent\Assign_team_agent::all();
             // $total_members = $assign_team_agent->where('team_id',$id)->count();
         }
-
 ?>
             
-    <div class="box box-primary">
-        <div class="box-header with-border">
-        @if($team_lead_name)
-            <span class="lead border-right">{!! Lang::get('lang.team_lead') !!} : {!! $team_lead !!} </span>
-         @endif
-            <span class="lead border-left">{!! Lang::get('lang.status') !!} : <?php if($teams->status == 1) { $stat = Lang::get('lang.active'); } elseif($teams->status == 0) { $stat = Lang::get('lang.inactive'); } ?>{!! $stat !!} </span>
-            
+<div class="card card-light">
 
-            <div class="pull-right">
-                <a href="{{URL::route('teams.index')}}" class="btn btn-primary"><i class="fa fa-arrow-left" aria-hidden="true"></i> {{Lang::get('lang.go_back')}}</a>
-            </div>
-        </div>
-        <input type="hidden" name="show_id" value={{$id}}>
-        <!-- /.box-header -->
-        <div class="box-body">             
-            {!! Datatable::table()
-                    ->addColumn(
-                        Lang::get('lang.user_name'),
-                        Lang::get('lang.name'),
-                        Lang::get('lang.status'),
-                        Lang::get('lang.group'),
-                        Lang::get('lang.depertment'),
-                        Lang::get('lang.role')
-                    )
-                    ->setUrl(route('teams.getshow.list', $id))  // this is the route where data will be retrieved
-                    ->render() 
-            !!}
-        </div>
-        <!-- /.box-body -->
-        <div class="box-footer">
+    <div class="card-header">
+    @if($team_lead_name)
+        <h3 class="lead card-title">{!! Lang::get('lang.team_lead') !!} : {!! $team_lead !!} </h3>
+     @endif
+        <h3 class="lead card-title"> &nbsp;| {!! Lang::get('lang.status') !!} : <?php if($teams->status == 1) { $stat = Lang::get('lang.active'); } elseif($teams->status == 0) { $stat = Lang::get('lang.inactive'); } ?>{!! $stat !!} </h3>
+        
+        <div class="card-tools">
+            <a href="{{URL::route('teams.index')}}" class="btn btn-default btn-tool">
+                <i class="fas fa-arrow-left" aria-hidden="true"></i> {{Lang::get('lang.go_back')}}
+            </a>
         </div>
     </div>
-        
-
+    <input type="hidden" name="show_id" value={{$id}}>
+    <!-- /.box-header -->
+    <div class="card-body">             
+        {!! Datatable::table()
+                ->addColumn(
+                    Lang::get('lang.user_name'),
+                    Lang::get('lang.name'),
+                    Lang::get('lang.status'),
+                    Lang::get('lang.group'),
+                    Lang::get('lang.depertment'),
+                    Lang::get('lang.role')
+                )
+                ->setUrl(route('teams.getshow.list', $id))  // this is the route where data will be retrieved
+                ->render() 
+        !!}
+    </div>
+</div>
 @stop
\ No newline at end of file
diff --git a/resources/views/themes/default1/admin/layout/admin.blade.php b/resources/views/themes/default1/admin/layout/admin.blade.php
index 6fdb5ee90..b8b433df6 100644
--- a/resources/views/themes/default1/admin/layout/admin.blade.php
+++ b/resources/views/themes/default1/admin/layout/admin.blade.php
@@ -334,14 +334,14 @@
                             
                             <li class="nav-header">{!! Lang::get('lang.settings-2') !!}</li>
 
-                            <li class="nav-item">
+                            <li @yield('staff-menu-parent') class="nav-item">
 
                                 <a  href="#" @yield('Staffs') class="nav-link">
                                     <i class="nav-icon fas fa-users"></i> 
                                     <p>{!! Lang::get('lang.staffs') !!} <i class="right fas fa-angle-left"></i></p> 
                                 </a>
 
-                                <ul class="nav nav-treeview">
+                                <ul @yield('staff-menu-open') class="nav nav-treeview">
 
                                     <li class="nav-item">
                                         <a href="{{ url('agents') }}" @yield('agents') class="nav-link">
@@ -671,7 +671,7 @@
             </aside>
 
             <!-- Right side column. Contains the navbar and content of the page -->
-            <div class="content-wrapper">
+            <div class="content-wrapper" style="padding-bottom: 1px;">
            
                 <div class="content-header">
                   <div class="container-fluid">
diff --git a/resources/views/themes/default1/agent/layout/agent.blade.php b/resources/views/themes/default1/agent/layout/agent.blade.php
index 59c505eba..211681aae 100644
--- a/resources/views/themes/default1/agent/layout/agent.blade.php
+++ b/resources/views/themes/default1/agent/layout/agent.blade.php
@@ -480,7 +480,7 @@
             $group = App\Model\helpdesk\Agent\Groups::where('id', '=', $agent_group)->first();
             ?>
             <!-- Right side column. Contains the navbar and content of the page -->
-            <div class="content-wrapper">
+            <div class="content-wrapper" style="padding-bottom: 1px;">
 
                 <div class="tab-content" style="position: fixed;z-index: 1;width: 100%;">
                   @if($replacetop==0)