diff --git a/resources/views/themes/default1/admin/helpdesk/emails/banlist/create.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/banlist/create.blade.php
index d7839f373..dda1e3da5 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/banlist/create.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/banlist/create.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('ban')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -29,57 +33,62 @@ class="active"
 <!-- content -->
 @section('content')
 {!! Form::open(['action' => 'Admin\helpdesk\BanlistController@store','method' => 'POST']) !!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{{Lang::get('lang.create_a_banned_email')}}</h3>
+
+@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
+@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('ban'))
+    <li class="error-message-padding">{!! $errors->first('ban', ':message') !!}</li>
+    @endif
+    @if($errors->first('email'))
+    <li class="error-message-padding">{!! $errors->first('email', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{{Lang::get('lang.create_a_banned_email')}}</h3>
     </div>
     <!-- Ban Status : Radio form : Required -->
-    <div class="box-body">
-        @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
-        @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('ban'))
-            <li class="error-message-padding">{!! $errors->first('ban', ':message') !!}</li>
-            @endif
-            @if($errors->first('email'))
-            <li class="error-message-padding">{!! $errors->first('email', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
-        <div class="form-group {{ $errors->has('ban') ? 'has-error' : '' }}">
-            {!! Form::label('ban',Lang::get('lang.ban_status')) !!} <span class="text-red"> *</span>
-            <div class="row">
-                <div class="col-xs-3">
-                    {!! Form::radio('ban',1) !!} {{Lang::get('lang.active')}}
-                </div>
-                <div class="col-xs-3">
-                    {!! Form::radio('ban',0) !!} {{Lang::get('lang.inactive')}}
+    <div class="card-body">
+        
+        <div class="row">
+            <!-- email Address : Text form : Required -->
+            <div class="form-group col-sm-6 {{ $errors->has('email') ? 'has-error' : '' }}">
+                {!! Form::label('email',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
+                {!! Form::text('email',null,['class' => 'form-control']) !!}
+
+            </div>
+
+            <div class="form-group col-sm-6 {{ $errors->has('ban') ? 'has-error' : '' }}">
+                {!! Form::label('ban',Lang::get('lang.ban_status')) !!} <span class="text-red"> *</span>
+                <div class="row">
+                    <div class="col-sm-3">
+                        {!! Form::radio('ban',1) !!} {{Lang::get('lang.active')}}
+                    </div>
+                    <div class="col-sm-3">
+                        {!! Form::radio('ban',0) !!} {{Lang::get('lang.inactive')}}
+                    </div>
                 </div>
             </div>
         </div>
-        <!-- email Address : Text form : Required -->
-        <div class="form-group {{ $errors->has('email') ? 'has-error' : '' }}">
-            {!! Form::label('email',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
-            {!! Form::text('email',null,['class' => 'form-control']) !!}
-
-        </div>
         <!-- intrnal Notes : Textarea :  -->
         <div class="form-group">
             {!! Form::label('internal_note',Lang::get('lang.internal_notes')) !!}
             {!! Form::textarea('internal_note',null,['class' => 'form-control']) !!}
         </div>
     </div>
-    <div class="box-footer">
+    <div class="card-footer">
         {!! Form::submit(Lang::get('lang.submit'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/emails/banlist/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/banlist/edit.blade.php
index 66c618dcf..50e93baaa 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/banlist/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/banlist/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('ban')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -28,46 +32,49 @@ class="active"
 <!-- content -->
 @section('content')
 {!! Form::model($bans,['url'=>'banlist/'.$bans->id,'method'=>'PATCH']) !!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{{Lang::get('lang.edit_banned_email')}}</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('ban'))
+    <li class="error-message-padding">{!! $errors->first('ban', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{{Lang::get('lang.edit_banned_email')}}</h3>
     </div>
     <!-- Ban Status : Radio form : Required -->
-    <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('ban'))
-            <li class="error-message-padding">{!! $errors->first('ban', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
-        <div class="form-group {{ $errors->has('ban') ? 'has-error' : '' }}">
-            {!! Form::label('ban',Lang::get('lang.ban_status')) !!} <span class="text-red"> *</span>
-            <div class="row">
-                <div class="col-xs-2">
-                    {!! Form::radio('ban',1) !!} {{Lang::get('lang.active')}}
-                </div>
-                <div class="col-xs-2">
-                    {!! Form::radio('ban',0) !!} {{Lang::get('lang.inactive')}}
+    <div class="card-body">
+        
+        <div class="row">
+            <!-- email Address : Text form : Required -->
+            <div class="form-group col-sm-6 {{ $errors->has('email') ? 'has-error' : '' }}">
+                {!! Form::label('email',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
+                {!! Form::text('email',null,['disabled'=>'disabled','class' => 'form-control']) !!}
+            </div>
+            <div class="form-group col-sm-6 {{ $errors->has('ban') ? 'has-error' : '' }}">
+                {!! Form::label('ban',Lang::get('lang.ban_status')) !!} <span class="text-red"> *</span>
+                <div class="row">
+                    <div class="col-sm-2">
+                        {!! Form::radio('ban',1) !!} {{Lang::get('lang.active')}}
+                    </div>
+                    <div class="col-sm-2">
+                        {!! Form::radio('ban',0) !!} {{Lang::get('lang.inactive')}}
+                    </div>
                 </div>
             </div>
         </div>
-        <!-- email Address : Text form : Required -->
-        <div class="form-group {{ $errors->has('email') ? 'has-error' : '' }}">
-            {!! Form::label('email',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
-            {!! Form::text('email',null,['disabled'=>'disabled','class' => 'form-control']) !!}
-        </div>
         <!-- intrnal Notes : Textarea :  -->
         <div class="form-group">
             {!! Form::label('internal_note',Lang::get('lang.internal_notes')) !!}
             {!! Form::textarea('internal_note',null,['class' => 'form-control']) !!}
         </div>
     </div>
-    <div class="box-footer">
+    <div class="card-footer">
         {!! Form::submit(Lang::get('lang.update'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/emails/banlist/index.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/banlist/index.blade.php
index 19ecd76b3..8944e8655 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/banlist/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/banlist/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('ban')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -28,29 +32,33 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h2 class="box-title">{{Lang::get('lang.list_of_banned_emails')}}</h2><a href="{{route('banlist.create')}}" class="pull-right btn btn-primary">{{Lang::get('lang.ban_email')}}</a>
+<!-- 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_banned_emails')}}</h3>
+        <div class="card-tools">
+            <a href="{{route('banlist.create')}}" class="btn btn-default btn-tool"><i class="fas fa-ban"> </i> {{Lang::get('lang.ban_email')}}</a>
+        </div>
     </div>
-    <div class="box-body">
-        <!-- 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
-        <table class="table table-bordered dataTable" style="overflow:hidden;">
+    <div class="card-body">
+        
+        <table class="table table-bordered dataTable" style="overflow:scroll;">
             <tr>
                 <th width="100px">{{Lang::get('lang.email_address')}}</th>
                 <th width="100px">{{Lang::get('lang.last_updated')}}</th>
@@ -65,7 +73,8 @@ class="active"
                 <td> {!! UTC::usertimezone($ban->updated_at) !!} </td>
                 <!-- Deleting Fields -->
                 <td>
-                    <a href="{{route('banlist.edit',$ban->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('banlist.delete',$ban->id)}}" class="btn btn-danger btn-xs btn-flat"><i class="fa fa-trash" style="color:black;"> </i> {!! Lang::get('lang.delete') !!}</a>
+                    <a href="{{route('banlist.edit',$ban->id)}}" class="btn btn-primary btn-xs"><i class="fas fa-edit"> </i> {!! Lang::get('lang.edit') !!}</a> 
+                    <a href="{{route('banlist.delete',$ban->id)}}" class="btn btn-danger btn-xs"><i class="fas fa-trash"> </i> {!! Lang::get('lang.delete') !!}</a>
                 </td>
                 @endforeach
             </tr>
diff --git a/resources/views/themes/default1/admin/helpdesk/emails/emails/create.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/emails/create.blade.php
index 889458591..248c15b8c 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/emails/create.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/emails/create.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('emails')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,211 +31,210 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')<!-- open a form -->
+
 <form id="form">
+    <div id="head"></div>    
+    <div id="alert" style="display:none;">
+        <div class="alert alert-danger alert-dismissable">
+            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+            <div id="alert-message"></div>
+        </div>
+    </div>
     <input type="hidden" name="_token" value="{{ csrf_token() }}">
-    <div class="box box-primary">
-        <div class="box-header with-border">
-            <h3 class="box-title">{!! Lang::get('lang.email_information_and_settings') !!}</h3>
+    <div class="card card-light">
+        <div class="card-header">
+            <h3 class="card-title">{!! Lang::get('lang.email_information_and_settings') !!}</h3>
         </div>
-        <div class="box-body">
-            <div id="head"></div>
-            <div id="alert" style="display:none;">
-                <div class="alert alert-danger alert-dismissable">
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    <div id="alert-message"></div>
-                </div>
-            </div>
-        </div>
-        <div class="box-body">
+        <div class="card-body">
             <div class="row">
                 <!-- email address -->
-                <div class="col-xs-6 form-group {!! $errors->has('email_address') ? 'has-error' : '' !!}" id = "email_address_error">
+                <div class="col-sm-6 form-group {!! $errors->has('email_address') ? 'has-error' : '' !!}" id = "email_address_error">
                     {!! Form::label('email_address',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
                     {!! $errors->first('email_address', '<spam class="help-block">:message</spam>') !!}
                     {!! Form::text('email_address',null,['class' => 'form-control', 'id' => 'email_address']) !!}
                 </div>
                 <!-- user name -->
-                <div class="col-xs-6 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}" id="user_name_error">
+                <div class="col-sm-6 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}" id="user_name_error">
                     {!! Form::label('user_name',Lang::get('lang.user_name')) !!}
                     {!! $errors->first('user_name', '<spam class="help-block">:message</spam>') !!}
                     {!! Form::text('user_name',null,['class' => 'form-control']) !!}
                 </div>
                 <!-- Email name -->
-                <div class="col-xs-6 form-group {!! $errors->has('email_name') ? 'has-error' : ''!!}" id="email_name_error">
+                <div class="col-sm-6 form-group {!! $errors->has('email_name') ? 'has-error' : ''!!}" id="email_name_error">
                     {!! Form::label('email_name',Lang::get('lang.from_name')) !!} <span class="text-red"> *</span>
                     {!! $errors->first('email_name', '<spam class="help-block">:message</spam>') !!}
                     {!! Form::text('email_name',null,['class' => 'form-control', 'id' => 'email_name']) !!}
                 </div>
                 <!-- password -->
-                <div class="col-xs-6 form-group {!! $errors->has('password') ? 'has-error' : ''!!}" id="password_error">
+                <div class="col-sm-6 form-group {!! $errors->has('password') ? 'has-error' : ''!!}" id="password_error">
                     {!! Form::label('password',Lang::get('lang.password')) !!} <span class="text-red"> *</span>
                     {!! $errors->first('password', '<spam class="help-block">:message</spam>') !!}
                     {!! Form::password('password',['class' => 'form-control', 'id' => 'password']) !!}
                 </div>
             </div>
-        </div>
-        <div class="box-header with-border">
-            <h3 class="box-title">{!! Lang::get('lang.new_ticket_settings') !!}</h3>
-        </div>
-        <div class="box-body">
-            <div class="row">
-                <!-- department -->
-                <div class="col-xs-4 form-group {!! $errors->has('department') ? 'has-error' : ''!!}" id="department_error">
-                    {!! Form::label('department',Lang::get('lang.department')) !!}
-                    {!! $errors->first('department', '<spam class="help-block">:message</spam>') !!}
-                    {!!Form::select('department', [''=>'--System Default--','departments'=>$departments->pluck('name','id')->toArray()],null,['class' => 'form-control select', 'id' => 'department' ]) !!}
+        
+            <div class="card card-light">
+                
+                <div class="card-header">
+                    <h3 class="card-title">{!! Lang::get('lang.new_ticket_settings') !!}</h3>
                 </div>
-                <!-- Priority -->
-                <div class="col-xs-4 form-group {!! $errors->has('priority') ? 'has-error' : ''!!}" id="priority_error">
-                    {!! Form::label('priority',Lang::get('lang.priority')) !!}
-                    {!! $errors->first('priority', '<spam class="help-block">:message</spam>') !!}
-                    {!!Form::select('priority', [''=>'--System Default--','Priorities'=>$priority->pluck('priority_desc','priority_id')->toArray()],null,['class' => 'form-control select', 'id' => 'priority']) !!}
-                </div>
-                <!-- Help topic -->
-                <div class="col-xs-4 form-group {!! $errors->has('help_topic') ? 'has-error' : ''!!}" id="help_topic_error">
-                    {!! Form::label('help_topic',Lang::get('lang.help_topic')) !!}
-                    {!! $errors->first('help_topic', '<spam class="help-block">:message</spam>') !!}
-                    {!!Form::select('help_topic', [''=>'--System Default--','Help Topics'=>$helps->pluck('topic','id')->toArray()],null,['class' => 'form-control select', 'id' => 'help_topic']) !!}
-                </div>
-                <!-- status -->
-                <div class="col-xs-2 form-group">
-                    {!! Form::label('auto_response',Lang::get('lang.auto_response')) !!}
-                </div>
-                <div class="col-xs-3 form-group">
 
-                    <input type="checkbox" name="auto_response" id="auto_response"> {{Lang::get('lang.disable_for_this_email_address')}}
-                </div>
-            </div>
-        </div>
-        <div class="box-header with-border">
-            <h3 class="box-title">{!! Lang::get('lang.incoming_email_information') !!}</h3>
-        </div>
-        <div class="box-body">
-            <div class="row">
-                <div class="form-group">
-                    <!-- status -->
-                    <div class="col-xs-1 form-group">
-                        {!! Form::label('fetching_status',Lang::get('lang.status')) !!}
+                <div class="card-body">
+                    <div class="row">
+                        <!-- department -->
+                        <div class="col-sm-4 form-group {!! $errors->has('department') ? 'has-error' : ''!!}" id="department_error">
+                            {!! Form::label('department',Lang::get('lang.department')) !!}
+                            {!! $errors->first('department', '<spam class="help-block">:message</spam>') !!}
+                            {!!Form::select('department', [''=>'--System Default--','departments'=>$departments->pluck('name','id')->toArray()],null,['class' => 'form-control select', 'id' => 'department' ]) !!}
+                        </div>
+                        <!-- Priority -->
+                        <div class="col-sm-4 form-group {!! $errors->has('priority') ? 'has-error' : ''!!}" id="priority_error">
+                            {!! Form::label('priority',Lang::get('lang.priority')) !!}
+                            {!! $errors->first('priority', '<spam class="help-block">:message</spam>') !!}
+                            {!!Form::select('priority', [''=>'--System Default--','Priorities'=>$priority->pluck('priority_desc','priority_id')->toArray()],null,['class' => 'form-control select', 'id' => 'priority']) !!}
+                        </div>
+                        <!-- Help topic -->
+                        <div class="col-sm-4 form-group {!! $errors->has('help_topic') ? 'has-error' : ''!!}" id="help_topic_error">
+                            {!! Form::label('help_topic',Lang::get('lang.help_topic')) !!}
+                            {!! $errors->first('help_topic', '<spam class="help-block">:message</spam>') !!}
+                            {!!Form::select('help_topic', [''=>'--System Default--','Help Topics'=>$helps->pluck('topic','id')->toArray()],null,['class' => 'form-control select', 'id' => 'help_topic']) !!}
+                        </div>
+                        <!-- status -->
+                        <div class="col-sm-2 form-group">
+                            {!! Form::label('auto_response',Lang::get('lang.auto_response')) !!}
+                        </div>
+                        <div class="col-sm-3 form-group">
+
+                            <input type="checkbox" name="auto_response" id="auto_response"> {{Lang::get('lang.disable_for_this_email_address')}}
+                        </div>
                     </div>
-                    <div class="col-xs-2 form-group">
-                        <!--{!! Form::radio('fetching_status','1',true) !!} {{Lang::get('lang.enable')}}-->
-                        <input type="checkbox" name="fetching_status" id="fetching_status"> {{Lang::get('lang.enable')}}
+                </div>    
+            </div>
+            
+            <div class="card card-light">
+                
+                <div class="card-header">
+                    <h3 class="card-title">{!! Lang::get('lang.incoming_email_information') !!}</h3>
+                </div>
+
+                <div class="card-body">
+                    <div>
+                        <div class="form-group">
+                            <!-- status -->
+                            {!! Form::label('fetching_status',Lang::get('lang.status')) !!}
+                            <input type="checkbox" name="fetching_status" id="fetching_status"> {{Lang::get('lang.enable')}}
+                        </div>
                     </div>
-                    <div class="col-xs-2 form-group">
-                        <!--<input type="radio" name="fetching_status" id="fetching_status" value="0"> {{Lang::get('lang.disabled')}}-->
+                    <div class="row">
+                        <div class="col-sm-2 form-group {!! $errors->has('fetching_protocol') ? 'has-error' : ''!!}" id="fetching_protocol_error">
+                            {!! Form::label('fetching_protocol',Lang::get('lang.protocol')) !!}
+                            {!! $errors->first('fetching_protocol', '<spam class="help-block">:message</spam>') !!}
+                            {!!Form::select('fetching_protocol',['imap' => 'IMAP', 'pop' => 'POP3'],null,['class' => 'form-control select', 'id' => 'fetching_protocol']) !!}
+                        </div>
+                        <div class="col-sm-2 form-group  {!! $errors->has('fetching_host') ? 'has-error' : ''!!}" id="fetching_host_error">
+                            {!! Form::label('fetching_host',Lang::get('lang.host_name')) !!}
+                            {!! $errors->first('fetching_host', '<spam class="help-block">:message</spam>') !!}
+                            {!! Form::text('fetching_host',null,['class' => 'form-control', 'id' => 'fetching_host']) !!}
+                        </div>
+                        <div class="col-sm-2 form-group {!! $errors->has('fetching_port') ? 'has-error' : ''!!}" id="fetching_port_error">
+                            {!! Form::label('fetching_port',Lang::get('lang.port_number')) !!}
+                            {!! $errors->first('fetching_port', '<spam class="help-block">:message</spam>') !!}
+                            {!! Form::text('fetching_port',null,['class' => 'form-control', 'id' => 'fetching_port']) !!}
+                        </div>
+                        <div class="col-sm-2 form-group {!! $errors->has('fetching_encryption') ? 'has-error' : ''!!}" id="fetching_encryption_error">
+                            {!! Form::label('fetching_encryption',Lang::get('lang.encryption')) !!}
+                            {!! $errors->first('fetching_encryption', '<spam class="help-block">:message</spam>') !!}
+                            {!!Form::select('fetching_encryption',[''=>'-----Select-----','ssl' => 'SSL', 'tls' => 'TLS', 'starttls' => 'STARTTLS'],null,['class' => 'form-control select', 'id' => 'fetching_encryption']) !!}
+                        </div>
+                        <div class="col-sm-2 form-group {!! $errors->has('imap_authentication') ? 'has-error' : ''!!}" id="imap_authentication_error">
+                            {!! Form::label('fetching_authentication',Lang::get('lang.authentication')) !!}
+                            {!!Form::select('imap_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'imap_authentication']) !!}
+                        </div>
+                        <div class="col-sm-2 form-group">
+                            <br>
+                            <input type="checkbox" name="imap_validate" id="imap_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
+                        </div>
                     </div>
-                </div>
+                </div>    
             </div>
-            <div class="row">
-                <div class="col-xs-2 form-group {!! $errors->has('fetching_protocol') ? 'has-error' : ''!!}" id="fetching_protocol_error">
-                    {!! Form::label('fetching_protocol',Lang::get('lang.protocol')) !!}
-                    {!! $errors->first('fetching_protocol', '<spam class="help-block">:message</spam>') !!}
-                    {!!Form::select('fetching_protocol',['imap' => 'IMAP', 'pop' => 'POP3'],null,['class' => 'form-control select', 'id' => 'fetching_protocol']) !!}
-                </div>
-                <div class="col-xs-2 form-group  {!! $errors->has('fetching_host') ? 'has-error' : ''!!}" id="fetching_host_error">
-                    {!! Form::label('fetching_host',Lang::get('lang.host_name')) !!}
-                    {!! $errors->first('fetching_host', '<spam class="help-block">:message</spam>') !!}
-                    {!! Form::text('fetching_host',null,['class' => 'form-control', 'id' => 'fetching_host']) !!}
-                </div>
-                <div class="col-xs-2 form-group {!! $errors->has('fetching_port') ? 'has-error' : ''!!}" id="fetching_port_error">
-                    {!! Form::label('fetching_port',Lang::get('lang.port_number')) !!}
-                    {!! $errors->first('fetching_port', '<spam class="help-block">:message</spam>') !!}
-                    {!! Form::text('fetching_port',null,['class' => 'form-control', 'id' => 'fetching_port']) !!}
-                </div>
-                <div class="col-xs-2 form-group {!! $errors->has('fetching_encryption') ? 'has-error' : ''!!}" id="fetching_encryption_error">
-                    {!! Form::label('fetching_encryption',Lang::get('lang.encryption')) !!}
-                    {!! $errors->first('fetching_encryption', '<spam class="help-block">:message</spam>') !!}
-                    {!!Form::select('fetching_encryption',[''=>'-----Select-----','ssl' => 'SSL', 'tls' => 'TLS', 'starttls' => 'STARTTLS'],null,['class' => 'form-control select', 'id' => 'fetching_encryption']) !!}
-                </div>
-                <div class="col-xs-2 form-group {!! $errors->has('imap_authentication') ? 'has-error' : ''!!}" id="imap_authentication_error">
-                    {!! Form::label('fetching_authentication',Lang::get('lang.authentication')) !!}
-                    {!!Form::select('imap_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'imap_authentication']) !!}
-                </div>
-                <div class="col-xs-2 form-group">
-                    <br>
-                    <input type="checkbox" name="imap_validate" id="imap_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
+            
+            <div class="card card-light">
+                
+                <div class="card-header">
+                    <h3 class="card-title">{!! Lang::get('lang.outgoing_email_information') !!}</h3>
                 </div>
+                <div class="card-body">
+                    <div>
+                        <!-- status -->
+                        <div class="form-group">
+                            {!! Form::label('sending_status',Lang::get('lang.status')) !!} 
+                            <input type="checkbox" name="sending_status" id="sending_status"> {!! Lang::get('lang.enable') !!} 
+                        </div>
+                    </div>
+                    <div class="row">
+                        <!-- Encryption -->
+                        <div class="col-sm-2 form-group {!! $errors->has('sending_protocol') ? 'has-error' : ''!!}" id="sending_protocol_error">
+                            {!! Form::label('sending_protocol',Lang::get('lang.transfer_protocol')) !!}
+                            {!! $errors->first('sending_protocol', '<spam class="help-block">:message</spam>') !!} 
+                            {!!Form::select('sending_protocol',[''=>'Select','Drives'=>$services],null,['class' => 'form-control select','id'=>'service']) !!}
+                        </div> 
+                        <!-- sending hoost -->
+                        <div class="col-sm-2 form-group {!! $errors->has('sending_host') ? 'has-error' : ''!!}" id="sending_host_error">
+                            {!! Form::label('sending_host',Lang::get('lang.host_name')) !!}
+                            {!! $errors->first('sending_host', '<spam class="help-block">:message</spam>') !!} 
+                            {!! Form::text('sending_host',null,['class' => 'form-control']) !!}
+                        </div> 
+                        <!-- sending port -->
+                        <div class="col-sm-2 form-group {!! $errors->has('sending_port') ? 'has-error' : ''!!}" id="sending_port_error">
+                            {!! Form::label('sending_port',Lang::get('lang.port_number')) !!}
+                            {!! $errors->first('sending_port', '<spam class="help-block">:message</spam>') !!}
+                            {!! Form::text('sending_port',null,['class' => 'form-control']) !!}
+                        </div>
+                        <!-- Encryption -->
+                        <div class="col-sm-2 form-group {!! $errors->has('sending_encryption') ? 'has-error' : ''!!}" id="sending_encryption_error">
+                            {!! Form::label('sending_encryption',Lang::get('lang.encryption')) !!}
+                            {!! $errors->first('sending_encryption', '<spam class="help-block">:message</spam>') !!} 
+                            {!!Form::select('sending_encryption',[''=>'-----Select-----','ssl' => 'SSL', 'tls' => 'TLS', 'starttls' => 'STARTTLS'],null,['class' => 'form-control select']) !!}
+                        </div> 
+                        <div class="col-sm-2 form-group {!! $errors->has('smtp_authentication') ? 'has-error' : ''!!}" id="smtp_authentication_error">
+                            {!! Form::label('sending_authentication',Lang::get('lang.authentication')) !!}
+                            {!!Form::select('smtp_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'smtp_authentication']) !!}
+                        </div>
+                        <div class="col-sm-2 form-group">
+                            <br>
+                            <input type="checkbox" name="smtp_validate" id="smtp_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
+                        </div>
+                    </div>
+                    <div id="response"></div>
+                    <!-- Internal notes -->
+                    <div class="form-group">
+                        {!! Form::label('internal_notes',Lang::get('lang.internal_notes')) !!}
+                        {!! Form::textarea('internal_notes',null,['class' => 'form-control','size' => '30x10']) !!}
+                    </div>
+                </div>    
             </div>
-        </div>
-        <div class="box-header with-border">
-            <h3 class="box-title">{!! Lang::get('lang.outgoing_email_information') !!}</h3>
-        </div>
-        <div class="box-body">
-            <div class="row">
-                <!-- status -->
-                <div class="form-group">
-                    <div class="col-xs-1 form-group"> 
-                        {!! Form::label('sending_status',Lang::get('lang.status')) !!} 
-                    </div> 
-                    <div class="col-xs-2 form-group"> 
-                        <input type="checkbox" name="sending_status" id="sending_status"> {!! Lang::get('lang.enable') !!} 
-                    </div> 
-                    <div class="col-xs-2 form-group"> 
-                        <!--<input type="radio" name="sending_status" id="sending_status" value=""> {!! Lang::get('lang.disabled') !!}--> 
-                    </div> 
-                </div>
-            </div>
-            <div class="row">
-                <!-- Encryption -->
-                <div class="col-xs-2 form-group {!! $errors->has('sending_protocol') ? 'has-error' : ''!!}" id="sending_protocol_error">
-                    {!! Form::label('sending_protocol',Lang::get('lang.transfer_protocol')) !!}
-                    {!! $errors->first('sending_protocol', '<spam class="help-block">:message</spam>') !!} 
-                    {!!Form::select('sending_protocol',[''=>'Select','Drives'=>$services],null,['class' => 'form-control select','id'=>'service']) !!}
-                </div> 
-                <!-- sending hoost -->
-                <div class="col-xs-2 form-group {!! $errors->has('sending_host') ? 'has-error' : ''!!}" id="sending_host_error">
-                    {!! Form::label('sending_host',Lang::get('lang.host_name')) !!}
-                    {!! $errors->first('sending_host', '<spam class="help-block">:message</spam>') !!} 
-                    {!! Form::text('sending_host',null,['class' => 'form-control']) !!}
-                </div> 
-                <!-- sending port -->
-                <div class="col-xs-2 form-group {!! $errors->has('sending_port') ? 'has-error' : ''!!}" id="sending_port_error">
-                    {!! Form::label('sending_port',Lang::get('lang.port_number')) !!}
-                    {!! $errors->first('sending_port', '<spam class="help-block">:message</spam>') !!}
-                    {!! Form::text('sending_port',null,['class' => 'form-control']) !!}
-                </div>
-                <!-- Encryption -->
-                <div class="col-xs-2 form-group {!! $errors->has('sending_encryption') ? 'has-error' : ''!!}" id="sending_encryption_error">
-                    {!! Form::label('sending_encryption',Lang::get('lang.encryption')) !!}
-                    {!! $errors->first('sending_encryption', '<spam class="help-block">:message</spam>') !!} 
-                    {!!Form::select('sending_encryption',[''=>'-----Select-----','ssl' => 'SSL', 'tls' => 'TLS', 'starttls' => 'STARTTLS'],null,['class' => 'form-control select']) !!}
-                </div> 
-                <div class="col-xs-2 form-group {!! $errors->has('smtp_authentication') ? 'has-error' : ''!!}" id="smtp_authentication_error">
-                    {!! Form::label('sending_authentication',Lang::get('lang.authentication')) !!}
-                    {!!Form::select('smtp_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'smtp_authentication']) !!}
-                </div>
-                <div class="col-xs-2 form-group">
-                    <br>
-                    <input type="checkbox" name="smtp_validate" id="smtp_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
-                </div>
-            </div>
-            <div id="response"></div>
-            <!-- Internal notes -->
-            <div class="form-group">
-                {!! Form::label('internal_notes',Lang::get('lang.internal_notes')) !!}
-                {!! Form::textarea('internal_notes',null,['class' => 'form-control','size' => '30x10']) !!}
-            </div>
-        </div>
-        <div class="box-footer">
-            {!! Form::button('<i id="spin" class="fa fa-spinner" style="display:none;"></i> <b>' . Lang::get("lang.create").'</b>' ,['class'=>'btn btn-primary', 'type' => 'submit'])!!}
+        </div> 
+        
+        <div class="card-footer">
+            {!! Form::button('<i id="spin" class="fas fa-spinner" style="display:none;"></i>' . Lang::get("lang.create").'' ,['class'=>'btn btn-primary', 'type' => 'submit'])!!}
         </div>
     </div>
 </form>
 
-<div class="modal fade" id="loadingpopup" style="padding:200px;">
+<div class="modal fade" id="loadingpopup">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-header">
-                <div id="head">
+                <div id="head" class="text-center">
                     <button type="button" class="close" id="close" data-dismiss="modal" aria-label="Close" style="display:none;"><span aria-hidden="true">×</span></button>
-                    <div class="col-md-5"></div><div class="col-md-2"><img src="{{asset("lb-faveo/media/images/gifloader.gif")}}" ></div><div class="col-md-5"></div>
+                    <img src="{{asset("lb-faveo/media/images/gifloader.gif")}}" >
                     <br/>
                     <br/>
                     <br/>
                     <center><h3 style="color:#80DE02;">Testing incoming & outgoing mail server</h3></center>
                     <br/>
-                    <center><h4>Please wait while testing is in progress ...</h4></center>
-                    <center><h4>(Please do not use "Refresh" or "Back" button)</h4></center>
+                    <center><h6>Please wait while testing is in progress ...</h6></center>
+                    <center><h6>(Please do not use "Refresh" or "Back" button)</h6></center>
                     <br/>
                 </div>
             </div>
diff --git a/resources/views/themes/default1/admin/helpdesk/emails/emails/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/emails/edit.blade.php
index 536cda9a7..ddf50bbc6 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/emails/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/emails/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('emails')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -29,242 +33,245 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!!Form::model($emails,['url'=>'','id'=>'form'])!!}
+
+<div id="head"></div>
+<div id="alert" style="display:none;">
+    <div class="alert alert-danger alert-dismissable">
+        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+        <div id="alert-message"></div>
+    </div>
+</div>
+
 <input type="hidden" name="_token" value="{{ csrf_token() }}">
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.email_information_and_settings') !!}</h3>
+
+<div class="card card-light">
+
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.email_information_and_settings') !!}</h3>
     </div>
-    <div class="box-body">
-        <div id="head"></div>
-        <div id="alert" style="display:none;">
-            <div class="alert alert-danger alert-dismissable">
-                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                <div id="alert-message"></div>
-            </div>
-        </div>
-    </div>
-    <div class="box-body">
+
+    <div class="card-body">
         <div class="row">
             <!-- email address -->
-            <div class="col-xs-6 form-group {{ $errors->has('email_address') ? 'has-error' : '' }}" id="email_address_error">
+            <div class="col-sm-6 form-group {{ $errors->has('email_address') ? 'has-error' : '' }}" id="email_address_error">
                 {!! Form::label('email_address',Lang::get('lang.email_address')) !!} <span class="text-red"> *</span>
                 {!! $errors->first('email_address', '<spam class="help-block">:message</spam>') !!}
                 {!! Form::text('email_address',null,['class' => 'form-control']) !!}
             </div>
             <!-- user name -->
-            <div class="col-xs-6 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}" id="user_name_error">
+            <div class="col-sm-6 form-group {{ $errors->has('user_name') ? 'has-error' : '' }}" id="user_name_error">
                 {!! Form::label('user_name',Lang::get('lang.user_name')) !!}
                 {!! $errors->first('user_name', '<spam class="help-block">:message</spam>') !!}
                 {!! Form::text('user_name',null,['class' => 'form-control']) !!}
             </div>
             <!-- Email name -->
-            <div class="col-xs-6 form-group {!! $errors->has('email_name') ? 'has-error' : ''!!}" id="email_name_error">
+            <div class="col-sm-6 form-group {!! $errors->has('email_name') ? 'has-error' : ''!!}" id="email_name_error">
                 {!! Form::label('email_name',Lang::get('lang.from_name')) !!} <span class="text-red"> *</span>
                 {!! $errors->first('email_name', '<spam class="help-block">:message</spam>') !!}
                 {!! Form::text('email_name',null,['class' => 'form-control', 'id' => 'email_name']) !!}
             </div>
             <!-- password -->
-            <div class="col-xs-6 form-group {!! $errors->has('password') ? 'has-error' : ''!!}" id="password_error">
+            <div class="col-sm-6 form-group {!! $errors->has('password') ? 'has-error' : ''!!}" id="password_error">
                 {!! Form::label('password',Lang::get('lang.password')) !!} <span class="text-red"> *</span>
                 {!! $errors->first('password', '<spam class="help-block">:message</spam>') !!}
                 <input type="password" name="password" class="form-control" id="password">
             </div>
         </div>
-    </div>
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.new_ticket_settings') !!}</h3>
-    </div>
-    <div class="box-body">
-        <div class="row">
-            <!-- department -->
-            <div class="col-xs-4 form-group {{ $errors->has('department') ? 'has-error' : '' }}">
-                {!! Form::label('department',Lang::get('lang.department')) !!}
-                {!! $errors->first('department', '<spam class="help-block">:message</spam>') !!}
-                {!!Form::select('department', [''=>'--System Default--','departments'=>$departments->pluck('name','id')->toArray()],null,['class' => 'form-control select']) !!}
+
+        <div class="card card-light">
+            
+            <div class="card-header">
+                <h3 class="card-title">{!! Lang::get('lang.new_ticket_settings') !!}</h3>
             </div>
-            <!-- priority -->
-            <div class="col-xs-4 form-group {{ $errors->has('priority') ? 'has-error' : '' }}">
-                {!! Form::label('priority',Lang::get('lang.priority')) !!}
-                {!! $errors->first('priority', '<spam class="help-block">:message</spam>') !!}
-                {!!Form::select('priority', [''=>'--System Default--','Priorities'=>$priority->pluck('priority_desc','priority_id')->toArray()],null,['class' => 'form-control select']) !!}
-            </div>
-            <!-- help topic -->
-            <div class="col-xs-4 form-group {{ $errors->has('help_topic') ? 'has-error' : '' }}">
-                {!! Form::label('help_topic',Lang::get('lang.help_topic')) !!}
-                {!! $errors->first('help_topic', '<spam class="help-block">:message</spam>') !!}
-                {!!Form::select('help_topic', [''=>'--System Default--','Help Topics'=>$helps->pluck('topic','id')->toArray()],null,['class' => 'form-control select']) !!}
-            </div>
-            <!-- status -->
-            <div class="col-xs-2 form-group">
-                {!! Form::label('auto_response', Lang::get('lang.auto_response')) !!}
-            </div>
-            <div class="col-xs-3 form-group">
-                <input type="checkbox" name="auto_response" id="auto_response" <?php
-                if ($emails->auto_response == 1) {
-                    echo "checked='checked'";
-                }
-                ?>> {!!Lang::get('lang.disable_for_this_email_address')!!}
-            </div>
-        </div>
-    </div>
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.incoming_email_information') !!}</h3>
-    </div>
-    <div class="box-body">
-        <div class="row">
-            <div class="form-group">
-                <!-- status -->
-                <div class="col-xs-1 form-group">
-                    {!! Form::label('fetching_status',Lang::get('lang.status')) !!}
-                </div>
-                <div class="col-xs-2 form-group">
-                    <!--{!! Form::radio('fetching_status','1',true) !!} {{Lang::get('lang.enable')}}-->
-                    <input type="checkbox" name="fetching_status" id="fetching_status"  <?php
-                    if ($emails->fetching_status == 1) {
-                        echo "checked='checked'";
-                    }
-                    ?>> {{Lang::get('lang.enable')}}
-                </div>
-                <div class="col-xs-2 form-group">
-                    <!--<input type="radio" name="fetching_status" id="fetching_status" value="0"> {{Lang::get('lang.disabled')}}-->
+            <div class="card-body">
+                <div class="row">
+                    <!-- department -->
+                    <div class="col-sm-4 form-group {{ $errors->has('department') ? 'has-error' : '' }}">
+                        {!! Form::label('department',Lang::get('lang.department')) !!}
+                        {!! $errors->first('department', '<spam class="help-block">:message</spam>') !!}
+                        {!!Form::select('department', [''=>'--System Default--','departments'=>$departments->pluck('name','id')->toArray()],null,['class' => 'form-control select']) !!}
+                    </div>
+                    <!-- priority -->
+                    <div class="col-sm-4 form-group {{ $errors->has('priority') ? 'has-error' : '' }}">
+                        {!! Form::label('priority',Lang::get('lang.priority')) !!}
+                        {!! $errors->first('priority', '<spam class="help-block">:message</spam>') !!}
+                        {!!Form::select('priority', [''=>'--System Default--','Priorities'=>$priority->pluck('priority_desc','priority_id')->toArray()],null,['class' => 'form-control select']) !!}
+                    </div>
+                    <!-- help topic -->
+                    <div class="col-sm-4 form-group {{ $errors->has('help_topic') ? 'has-error' : '' }}">
+                        {!! Form::label('help_topic',Lang::get('lang.help_topic')) !!}
+                        {!! $errors->first('help_topic', '<spam class="help-block">:message</spam>') !!}
+                        {!!Form::select('help_topic', [''=>'--System Default--','Help Topics'=>$helps->pluck('topic','id')->toArray()],null,['class' => 'form-control select']) !!}
+                    </div>
+                    <!-- status -->
+                    <div class="col-sm-2 form-group">
+                        {!! Form::label('auto_response', Lang::get('lang.auto_response')) !!}
+                    </div>
+                    <div class="col-sm-3 form-group">
+                        <input type="checkbox" name="auto_response" id="auto_response" <?php
+                        if ($emails->auto_response == 1) {
+                            echo "checked='checked'";
+                        }
+                        ?>> {!!Lang::get('lang.disable_for_this_email_address')!!}
+                    </div>
                 </div>
             </div>
         </div>
-        <div class="row">
-            <div class="col-xs-2 form-group {!! $errors->has('fetching_protocol') ? 'has-error' : ''!!}" id="fetching_protocol_error">
-                {!! Form::label('fetching_protocol',Lang::get('lang.fetching_protocol')) !!}
-                {!! $errors->first('fetching_protocol', '<spam class="help-block">:message</spam>') !!}
-                {!!Form::select('fetching_protocol',['imap' => 'IMAP', 'pop' => 'POP3'],null,['class' => 'form-control select', 'id' => 'fetching_protocol']) !!}
+
+        <div class="card card-light">
+            
+            <div class="card-header">
+                <h3 class="card-title">{!! Lang::get('lang.incoming_email_information') !!}</h3>
             </div>
-            <div class="col-xs-2 form-group  {!! $errors->has('fetching_host') ? 'has-error' : ''!!}" id="fetching_host_error">
-                {!! Form::label('fetching_host',Lang::get('lang.host_name')) !!}
-                {!! $errors->first('fetching_host', '<spam class="help-block">:message</spam>') !!}
-                {!! Form::text('fetching_host',null,['class' => 'form-control', 'id' => 'fetching_host']) !!}
-            </div>
-            <div class="col-xs-2 form-group {!! $errors->has('fetching_port') ? 'has-error' : ''!!}" id="fetching_port_error">
-                {!! Form::label('fetching_port',Lang::get('lang.port_number')) !!}
-                {!! $errors->first('fetching_port', '<spam class="help-block">:message</spam>') !!}
-                {!! Form::text('fetching_port',null,['class' => 'form-control', 'id' => 'fetching_port']) !!}
-            </div>
-            <div class="col-xs-2 form-group {!! $errors->has('fetching_encryption') ? 'has-error' : ''!!}" id="fetching_encryption_error">
-                {!! Form::label('fetching_encryption',Lang::get('lang.encryption')) !!}
-                {!! $errors->first('fetching_encryption', '<spam class="help-block">:message</spam>') !!}
-                <select name="fetching_encryption" class='form-control'  id='fetching_encryption'>
-                    <option value=""> -----Select----- </option>
-  
-                    <option <?php
-                    if ($emails->fetching_encryption == 'ssl' || $emails->fetching_encryption === 'ssl') {
-                        echo 'selected="selected"';
-                    }
-                    ?> value="ssl">SSL</option>
-                    <option <?php
-                    if ($emails->fetching_encryption == 'tls' || $emails->fetching_encryption === 'tls') {
-                        echo 'selected="selected"';
-                    }
-                    ?> value="tls">TLS</option>
-                    <option <?php
-                    if ($emails->fetching_encryption == 'starttls' || $emails->fetching_encryption === 'starttls') {
-                        echo 'selected="selected"';
-                    }
-                    ?> value="starttls">STARTTLS</option>
-                </select>
-            </div>
-            <div class="col-xs-2 form-group {!! $errors->has('imap_authentication') ? 'has-error' : ''!!}" id="imap_authentication_error">
-                {!! Form::label('fetching_authentication',Lang::get('lang.authentication')) !!}
-                {!!Form::select('imap_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'imap_authentication']) !!}
-            </div>
-            <div class="col-xs-2 form-group">
-                <br>
-                <input type="checkbox" name="imap_validate" id="imap_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
+            <div class="card-body">
+                <div>
+                    <div class="form-group">
+                        <!-- status -->
+
+                        {!! Form::label('fetching_status',Lang::get('lang.status')) !!}
+                        <input type="checkbox" name="fetching_status" id="fetching_status"  <?php
+                            if ($emails->fetching_status == 1) {
+                                echo "checked='checked'";
+                            }
+                            ?>> {{Lang::get('lang.enable')}}
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-sm-2 form-group {!! $errors->has('fetching_protocol') ? 'has-error' : ''!!}" id="fetching_protocol_error">
+                        {!! Form::label('fetching_protocol',Lang::get('lang.fetching_protocol')) !!}
+                        {!! $errors->first('fetching_protocol', '<spam class="help-block">:message</spam>') !!}
+                        {!!Form::select('fetching_protocol',['imap' => 'IMAP', 'pop' => 'POP3'],null,['class' => 'form-control select', 'id' => 'fetching_protocol']) !!}
+                    </div>
+                    <div class="col-sm-2 form-group  {!! $errors->has('fetching_host') ? 'has-error' : ''!!}" id="fetching_host_error">
+                        {!! Form::label('fetching_host',Lang::get('lang.host_name')) !!}
+                        {!! $errors->first('fetching_host', '<spam class="help-block">:message</spam>') !!}
+                        {!! Form::text('fetching_host',null,['class' => 'form-control', 'id' => 'fetching_host']) !!}
+                    </div>
+                    <div class="col-sm-2 form-group {!! $errors->has('fetching_port') ? 'has-error' : ''!!}" id="fetching_port_error">
+                        {!! Form::label('fetching_port',Lang::get('lang.port_number')) !!}
+                        {!! $errors->first('fetching_port', '<spam class="help-block">:message</spam>') !!}
+                        {!! Form::text('fetching_port',null,['class' => 'form-control', 'id' => 'fetching_port']) !!}
+                    </div>
+                    <div class="col-sm-2 form-group {!! $errors->has('fetching_encryption') ? 'has-error' : ''!!}" id="fetching_encryption_error">
+                        {!! Form::label('fetching_encryption',Lang::get('lang.encryption')) !!}
+                        {!! $errors->first('fetching_encryption', '<spam class="help-block">:message</spam>') !!}
+                        <select name="fetching_encryption" class='form-control'  id='fetching_encryption'>
+                            <option value=""> -----Select----- </option>
+          
+                            <option <?php
+                            if ($emails->fetching_encryption == 'ssl' || $emails->fetching_encryption === 'ssl') {
+                                echo 'selected="selected"';
+                            }
+                            ?> value="ssl">SSL</option>
+                            <option <?php
+                            if ($emails->fetching_encryption == 'tls' || $emails->fetching_encryption === 'tls') {
+                                echo 'selected="selected"';
+                            }
+                            ?> value="tls">TLS</option>
+                            <option <?php
+                            if ($emails->fetching_encryption == 'starttls' || $emails->fetching_encryption === 'starttls') {
+                                echo 'selected="selected"';
+                            }
+                            ?> value="starttls">STARTTLS</option>
+                        </select>
+                    </div>
+                    <div class="col-sm-2 form-group {!! $errors->has('imap_authentication') ? 'has-error' : ''!!}" id="imap_authentication_error">
+                        {!! Form::label('fetching_authentication',Lang::get('lang.authentication')) !!}
+                        {!!Form::select('imap_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'imap_authentication']) !!}
+                    </div>
+                    <div class="col-sm-2 form-group">
+                        <br>
+                        <input type="checkbox" name="imap_validate" id="imap_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
+                    </div>
+                </div>
             </div>
         </div>
-    </div>
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.outgoing_email_information') !!}</h3>
-    </div>
-    <div class="box-body">
-        <div class="row">
-            <!-- status -->
-            <div class="form-group">
-                <div class="col-xs-1 form-group"> 
-                    {!! Form::label('sending_status',Lang::get('lang.status')) !!} 
-                </div> 
-                <div class="col-xs-2 form-group"> 
-                    <input type="checkbox" name="sending_status" id="sending_status" <?php
-                    if ($emails->sending_status == 1) {
-                        echo "checked='checked'";
-                    }
-                    ?>> {!! Lang::get('lang.enable') !!} 
-                </div> 
-                <div class="col-xs-2 form-group"> 
-                    <!--<input type="radio" name="sending_status" id="sending_status" value=""> {!! Lang::get('lang.disabled') !!}--> 
-                </div> 
+
+        <div class="card card-light">
+                        
+            <div class="card-header">
+                <h3 class="card-title">{!! Lang::get('lang.outgoing_email_information') !!}</h3>
             </div>
+            <div class="card-body">
+                <div>
+                    <!-- status -->
+                    <div class="form-group">
+                         {!! Form::label('sending_status',Lang::get('lang.status')) !!} 
+                         <input type="checkbox" name="sending_status" id="sending_status" <?php
+                            if ($emails->sending_status == 1) {
+                                echo "checked='checked'";
+                            }
+                            ?>> {!! Lang::get('lang.enable') !!}  
+                    </div>
+                </div>
+                <div class="row">
+                    <!-- Encryption -->
+                    <div class="col-sm-2 form-group {!! $errors->has('sending_protocol') ? 'has-error' : ''!!}" id="sending_protocol_error">
+                        {!! Form::label('sending_protocol',Lang::get('lang.transfer_protocol')) !!}
+                        {!! $errors->first('sending_protocol', '<spam class="help-block">:message</spam>') !!} 
+                        {!!Form::select('sending_protocol',[''=>'Select','Drives'=>$services],$emails->getCurrentDrive(),['class' => 'form-control select','id'=>'service']) !!}
+                    </div> 
+                    <!-- sending hoost -->
+                    <div class="col-sm-2 form-group {!! $errors->has('sending_host') ? 'has-error' : ''!!}" id="sending_host_error">
+                        {!! Form::label('sending_host',Lang::get('lang.host_name')) !!}
+                        {!! $errors->first('sending_host', '<spam class="help-block">:message</spam>') !!} 
+                        {!! Form::text('sending_host',null,['class' => 'form-control']) !!}
+                    </div> 
+                    <!-- sending port -->
+                    <div class="col-sm-2 form-group {!! $errors->has('sending_port') ? 'has-error' : ''!!}" id="sending_port_error">
+                        {!! Form::label('sending_port',Lang::get('lang.port_number')) !!}
+                        {!! $errors->first('sending_port', '<spam class="help-block">:message</spam>') !!}
+                        {!! Form::text('sending_port',null,['class' => 'form-control']) !!}
+                    </div>
+                    <!-- Encryption -->
+                    <div class="col-sm-2 form-group {!! $errors->has('sending_encryption') ? 'has-error' : ''!!}" id="sending_encryption_error">
+                        {!! Form::label('sending_encryption',Lang::get('lang.encryption')) !!}
+                        {!! $errors->first('sending_encryption', '<spam class="help-block">:message</spam>') !!} 
+                        {!!Form::select('sending_encryption',[''=>'-----Select-----','ssl' => 'SSL', 'tls' => 'TLS', 'starttls' => 'STARTTLS'],null,['class' => 'form-control select']) !!}
+                    </div> 
+                    <div class="col-sm-2 form-group {!! $errors->has('smtp_authentication') ? 'has-error' : ''!!}" id="smtp_authentication_error">
+                        {!! Form::label('sending_authentication',Lang::get('lang.authentication')) !!}
+                        {!!Form::select('smtp_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'smtp_authentication']) !!}
+                    </div>
+                    <div class="col-sm-2 form-group">
+                        <br>
+                        <input type="checkbox" name="smtp_validate" id="smtp_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
+                    </div>
+                </div>
+                <div id="response"></div>
+                <!-- Internal notes -->
+                <div class="form-group">
+                    {!! Form::label('internal_notes',Lang::get('lang.internal_notes')) !!}
+                    {!! Form::textarea('internal_notes',null,['class' => 'form-control','size' => '30x10']) !!}
+                </div>
+            </div>
+            <input type="hidden" name="count" value="{{$count}}"> 
         </div>
-        <div class="row">
-            <!-- Encryption -->
-            <div class="col-xs-2 form-group {!! $errors->has('sending_protocol') ? 'has-error' : ''!!}" id="sending_protocol_error">
-                {!! Form::label('sending_protocol',Lang::get('lang.transfer_protocol')) !!}
-                {!! $errors->first('sending_protocol', '<spam class="help-block">:message</spam>') !!} 
-                {!!Form::select('sending_protocol',[''=>'Select','Drives'=>$services],$emails->getCurrentDrive(),['class' => 'form-control select','id'=>'service']) !!}
-            </div> 
-            <!-- sending hoost -->
-            <div class="col-xs-2 form-group {!! $errors->has('sending_host') ? 'has-error' : ''!!}" id="sending_host_error">
-                {!! Form::label('sending_host',Lang::get('lang.host_name')) !!}
-                {!! $errors->first('sending_host', '<spam class="help-block">:message</spam>') !!} 
-                {!! Form::text('sending_host',null,['class' => 'form-control']) !!}
-            </div> 
-            <!-- sending port -->
-            <div class="col-xs-2 form-group {!! $errors->has('sending_port') ? 'has-error' : ''!!}" id="sending_port_error">
-                {!! Form::label('sending_port',Lang::get('lang.port_number')) !!}
-                {!! $errors->first('sending_port', '<spam class="help-block">:message</spam>') !!}
-                {!! Form::text('sending_port',null,['class' => 'form-control']) !!}
-            </div>
-            <!-- Encryption -->
-            <div class="col-xs-2 form-group {!! $errors->has('sending_encryption') ? 'has-error' : ''!!}" id="sending_encryption_error">
-                {!! Form::label('sending_encryption',Lang::get('lang.encryption')) !!}
-                {!! $errors->first('sending_encryption', '<spam class="help-block">:message</spam>') !!} 
-                {!!Form::select('sending_encryption',[''=>'-----Select-----','ssl' => 'SSL', 'tls' => 'TLS', 'starttls' => 'STARTTLS'],null,['class' => 'form-control select']) !!}
-            </div> 
-            <div class="col-xs-2 form-group {!! $errors->has('smtp_authentication') ? 'has-error' : ''!!}" id="smtp_authentication_error">
-                {!! Form::label('sending_authentication',Lang::get('lang.authentication')) !!}
-                {!!Form::select('smtp_authentication',['normal' => 'Normal Password'],null,['class' => 'form-control select', 'id' => 'smtp_authentication']) !!}
-            </div>
-            <div class="col-xs-2 form-group">
-                <br>
-                <input type="checkbox" name="smtp_validate" id="smtp_validate">&nbsp; {!! Lang::get('lang.validate_certificates_from_tls_or_ssl_server') !!}
-            </div>
-        </div>
-        <div id="response"></div>
-        <!-- Internal notes -->
-        <div class="form-group">
-            {!! Form::label('internal_notes',Lang::get('lang.internal_notes')) !!}
-            {!! Form::textarea('internal_notes',null,['class' => 'form-control','size' => '30x10']) !!}
-        </div>
-    </div>
-    <input type="hidden" name="count" value="{{$count}}"> 
-    <div class="box-footer">
-        <div class="form-group">
+
+        <div>
             <input type="checkbox" name="sys_email" @if($sys_email->sys_email == $emails->id) checked  @endif @if($count > 1 && $sys_email->sys_email == $emails->id) disabled @endif">&nbsp;&nbsp;{{Lang::get('lang.make-system-default-mail')}}
         </div>
-        {!! Form::button('<i id="spin" class="fa fa-spinner" style="display:none;"></i> <b>' . Lang::get("lang.update").'</b>' ,['class'=>'btn btn-primary', 'type' => 'submit'])!!}
+    </div>
+    
+    <div class="card-footer">
+        {!! Form::button('<i id="spin" class="fas fa-spinner" style="display:none;"></i> ' . Lang::get("lang.update").'' ,['class'=>'btn btn-primary', 'type' => 'submit'])!!}
     </div>
 </div>
 {!!Form::close()!!}
-<div class="modal fade" id="loadingpopup" style="padding:200px;">
+<div class="modal fade" id="loadingpopup">
     <div class="modal-dialog">
         <div class="modal-content">
             <div class="modal-header">
-                <div id="head">
+                <div id="head" class="text-center">
                     <button type="button" class="close" id="close" data-dismiss="modal" aria-label="Close" style="display:none;"><span aria-hidden="true">×</span></button>
-                    <div class="col-md-5"></div><div class="col-md-2"><img src="{{asset("lb-faveo/media/images/gifloader.gif")}}" ></div><div class="col-md-5"></div>
+                    <img src="{{asset("lb-faveo/media/images/gifloader.gif")}}" >
                     <br/>
                     <br/>
                     <br/>
                     <center><h3 style="color:#80DE02;">Testing incoming & outgoing mail server</h3></center>
                     <br/>
-                    <center><h4>Please wait while testing is in progress ...</h4></center>
-                    <center><h4>(Please do not use "Refresh" or "Back" button)</h4></center>
+                    <center><h6>Please wait while testing is in progress ...</h6></center>
+                    <center><h6>(Please do not use "Refresh" or "Back" button)</h6></center>
                     <br/>
                 </div>
             </div>
@@ -302,7 +309,7 @@ class="active"
                 });
 
                 $("#head").html(res);
-                $('html, body').animate({scrollTop: $("#form").offset().top}, 500);
+                $('html, body').animate({scrollTop: $("#head").offset().top}, 500);
             },
             error: function (json) {
                 $("#close").trigger("click");
@@ -311,7 +318,7 @@ class="active"
                     res += "<li>" + topic + "</li>";
                 });
                 $("#head").html("<div class='alert alert-danger'><strong>Whoops!</strong> There were some problems with your input.<br><br><ul>" + res + "</ul></div>");
-                $('html, body').animate({scrollTop: $("#form").offset().top}, 500);
+                $('html, body').animate({scrollTop: $("#head").offset().top}, 500);
             }
         });
         return false;
diff --git a/resources/views/themes/default1/admin/helpdesk/emails/emails/index.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/emails/index.blade.php
index 0e598d372..68a9b3395 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/emails/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/emails/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('emails')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -28,96 +32,109 @@ 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.emails') !!}</h2><a href="{{route('emails.create')}}" class="btn btn-primary pull-right"><span class="glyphicon glyphicon-plus"></span> &nbsp;{{Lang::get('lang.create_email')}}</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>
-        <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
-    $default_system_email = App\Model\helpdesk\Settings\Email::where('id', '=', '1')->first();
-    if($default_system_email->sys_email) {
-    	$default_email = $default_system_email->sys_email;
-    } else {
-    	$default_email = null;
-    }
-    ?>
-    		<!-- table -->
-				<table class="table table-bordered dataTable" style="overflow:hidden;">
-	<tr>
-							<th width="100px">{{Lang::get('lang.email')}}</th>
-							<th width="100px">{{Lang::get('lang.priority')}}</th>
-							<th width="100px">{{Lang::get('lang.department')}}</th>
-							<th width="100px">{{Lang::get('lang.created')}}</th>
-							<th width="100px">{{Lang::get('lang.last_updated')}}</th>
-							<th width="100px">{{Lang::get('lang.action')}}</th>
-						</tr>
-						@foreach($emails as $email)
-						<tr>
-
-							<td><a href="{{route('emails.edit', $email->id)}}"> {{$email -> email_address }}</a>
-							@if($default_email == $email->id) 
-								( Default )
-								<?php $disabled = 'disabled'; ?>
-							@else
-								<?php $disabled = ''; ?>
-							@endif
-							</td>
-							<?php $priority = App\Model\helpdesk\Ticket\Ticket_Priority::where('priority_id','=',$email->priority)->first(); ?>
-							@if($email->priority == null)
-								<?php $priority = "<a href=". url('getticket') .">System Default</a>"; ?>
-							@else 
-								<?php $priority = ucfirst($priority->priority_desc); ?>
-							@endif
-							<td>{!! $priority !!}</td>
-							@if($email->department !== null)
-								<?php  $department = App\Model\helpdesk\Agent\Department::where('id','=',$email->department)->first(); 
-								$dept = $department->name; ?>
-							@elseif($email->department == null)
-								<?php  $dept = "<a href=". url('getsystem') .">System Default</a>"; ?>
-							@endif
-
-							<td>{!! $dept !!}</td>
-							<td>{!! UTC::usertimezone($email->created_at) !!}</td>
-							<td>{!! UTC::usertimezone($email->updated_at) !!}</td>
-							<td>
-							{!! Form::open(['route'=>['emails.destroy', $email->id],'method'=>'DELETE']) !!}
-							<a href="{{route('emails.edit', $email->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 '. $disabled,
-				            		'onclick'=>'return confirm("Are you sure?")'])
-				            	!!}
-							{!! Form::close() !!}
-							</td>
-						</tr>
-						@endforeach
-</table>
-</div>
+<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
+
+<div class="card card-light">
+
+	<div class="card-header">
+		
+		<h3 class="card-title">{!! Lang::get('lang.emails') !!}</h3>
+
+		<div class="card-tools">
+			
+			<a href="{{route('emails.create')}}" class="btn btn-default btn-tool">
+				<span class="fas fa-plus"></span>&nbsp;{{Lang::get('lang.create_email')}}
+			</a>
+		</div>	
+	</div>
+
+	<div class="card-body">
+	   <?php
+		   $default_system_email = App\Model\helpdesk\Settings\Email::where('id', '=', '1')->first();
+		   if($default_system_email->sys_email) {
+		    	$default_email = $default_system_email->sys_email;
+		   } else {
+		    	$default_email = null;
+		   }
+	   ?>
+    	<!-- table -->
+		<table class="table table-bordered dataTable" style="overflow:hidden;">
+			<tr>
+				<th width="100px">{{Lang::get('lang.email')}}</th>
+				<th width="100px">{{Lang::get('lang.priority')}}</th>
+				<th width="100px">{{Lang::get('lang.department')}}</th>
+				<th width="100px">{{Lang::get('lang.created')}}</th>
+				<th width="100px">{{Lang::get('lang.last_updated')}}</th>
+				<th width="100px">{{Lang::get('lang.action')}}</th>
+			</tr>
+
+			@foreach($emails as $email)
+			<tr>
+				<td><a href="{{route('emails.edit', $email->id)}}"> {{$email -> email_address }}</a>
+				@if($default_email == $email->id) 
+					( Default )
+					<?php $disabled = 'disabled'; ?>
+				@else
+					<?php $disabled = ''; ?>
+				@endif
+				</td>
+				<?php $priority = App\Model\helpdesk\Ticket\Ticket_Priority::where('priority_id','=',$email->priority)->first(); ?>
+				@if($email->priority == null)
+					<?php $priority = "<a href=". url('getticket') .">System Default</a>"; ?>
+				@else 
+					<?php $priority = ucfirst($priority->priority_desc); ?>
+				@endif
+				<td>{!! $priority !!}</td>
+				@if($email->department !== null)
+					<?php  $department = App\Model\helpdesk\Agent\Department::where('id','=',$email->department)->first(); 
+					$dept = $department->name; ?>
+				@elseif($email->department == null)
+					<?php  $dept = "<a href=". url('getsystem') .">System Default</a>"; ?>
+				@endif
+
+				<td>{!! $dept !!}</td>
+				<td>{!! UTC::usertimezone($email->created_at) !!}</td>
+				<td>{!! UTC::usertimezone($email->updated_at) !!}</td>
+				<td>
+				{!! Form::open(['route'=>['emails.destroy', $email->id],'method'=>'DELETE']) !!}
+				<a href="{{route('emails.edit', $email->id)}}" class="btn btn-primary btn-xs"><i class="fas fa-edit"> </i> Edit</a>
+				<!-- To pop up a confirm Message -->
+
+				@if($default_email == $email->id) 
+					{!! Form::button('<i class="fas fa-trash"> </i> Delete',
+	            		['class'=> 'btn btn-danger btn-xs '. $disabled])
+	            	!!}
+				@else
+					{!! Form::button('<i class="fas fa-trash"> </i> Delete',
+	            		['type' => 'submit',
+	            		'class'=> 'btn btn-danger btn-xs',
+	            		'onclick'=>'return confirm("Are you sure?")'])
+	            	!!}
+				@endif
+
+					
+				{!! Form::close() !!}
+				</td>
+			</tr>
+			@endforeach
+		</table>
+	</div>
 </div>
 @stop
diff --git a/resources/views/themes/default1/admin/helpdesk/emails/template/formDiagno.blade.php b/resources/views/themes/default1/admin/helpdesk/emails/template/formDiagno.blade.php
index fb6e7c591..0ddaa47fd 100644
--- a/resources/views/themes/default1/admin/helpdesk/emails/template/formDiagno.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/emails/template/formDiagno.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('diagnostics')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -24,48 +28,49 @@ class="active"
 <!-- check whether success or not -->
 <form method="POST" action="{!! route('postdiagno') !!}">
     <input type="hidden" name="_token" value="{{ csrf_token() }}">
-    <div class="box box-primary">
-        <div class="box-header with-border">
-            <h4 class="box-title">{{Lang::get('lang.send-mail-to-diagnos')}}</h4>	
+    @if(Session::has('success') && !Session::has('fails'))
+    <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-warning alert-dismissable">
+        <i class="fas fa-ban"></i>
+        <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+        <b>{!! Lang::get('lang.alert') !!} !</b><br/>
+        <li class="error-message-padding">{{Session::get('fails')}}</li>
+    </div>
+    @endif
+    @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('from'))
+        <li class="error-message-padding">{!! $errors->first('from', ':message') !!}</li>
+        @endif
+        @if($errors->first('to'))
+        <li class="error-message-padding">{!! $errors->first('to', ':message') !!}</li>
+        @endif
+        @if($errors->first('subject'))
+        <li class="error-message-padding">{!! $errors->first('subject', ':message') !!}</li>
+        @endif
+        @if($errors->first('message'))
+        <li class="error-message-padding">{!! $errors->first('message', ':message') !!}</li>
+        @endif
+    </div>
+    @endif
+    <div class="card card-light">
+        <div class="card-header">
+            <h3 class="card-title">{{Lang::get('lang.send-mail-to-diagnos')}}</h3>	
         </div>
-        <div class="box-body">
-            @if(Session::has('success') && !Session::has('fails'))
-            <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-warning alert-dismissable">
-                <i class="fa fa-ban"></i>
-                <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                <b>{!! Lang::get('lang.alert') !!} !</b><br/>
-                <li class="error-message-padding">{{Session::get('fails')}}</li>
-            </div>
-            @endif
-            @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('from'))
-                <li class="error-message-padding">{!! $errors->first('from', ':message') !!}</li>
-                @endif
-                @if($errors->first('to'))
-                <li class="error-message-padding">{!! $errors->first('to', ':message') !!}</li>
-                @endif
-                @if($errors->first('subject'))
-                <li class="error-message-padding">{!! $errors->first('subject', ':message') !!}</li>
-                @endif
-                @if($errors->first('message'))
-                <li class="error-message-padding">{!! $errors->first('message', ':message') !!}</li>
-                @endif
-            </div>
-            @endif
+        <div class="card-body">
+
             <div class="row form-group no-padding {!! $errors->has('from') ? 'has-error' : '' !!}">
                 <div class="col-md-2">
                     <label>{!! Lang::get('lang.from') !!} <span class="text-red">*</span> :</label>
@@ -114,14 +119,8 @@ class="active"
                 </div>
             </div>
         </div>
-        <div class="box-footer">
-            <div class="row">
-                <div class="col-md-2"></div>
-                <div class="col-md-2">
-                    {!! Form::submit(Lang::get('lang.send'),['class'=>'form-group btn btn-primary'])!!}
-                </div>            
-            </div>
-            
+        <div class="card-footer">
+            {!! Form::submit(Lang::get('lang.send'),['class'=>'btn btn-primary'])!!}
         </div>
     </div>
 </form>
diff --git a/resources/views/themes/default1/admin/helpdesk/queue/edit.blade.php b/resources/views/themes/default1/admin/helpdesk/queue/edit.blade.php
index c5a31edda..647d3ad6a 100644
--- a/resources/views/themes/default1/admin/helpdesk/queue/edit.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/queue/edit.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('queue')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -56,22 +60,21 @@ class="active"
     {{Session::get('warn')}}
 </div>
 @endif
-<div class="box">
-    <div class="box-header">
-        <div class="box-title">
-            {!! Lang::get('lang.queues') !!}
-        </div>
-
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.queues') !!}</h3>
     </div>
-    <div class="box-body">
+    <div class="card-body">
         {!! Form::open(['url'=>'queue/'.$queue->id,'method'=>'post','id'=>'form']) !!}
         <div id="response">
 
         </div>
-        {!! Form::submit('save',['class'=>'btn btn-primary']) !!}
-        {!! Form::close() !!}
     </div>
 
+    <div class="card-footer">
+        {!! Form::submit(Lang::get('lang.save'),['class'=>'btn btn-primary']) !!}
+        {!! Form::close() !!}
+    </div>
 </div>
 <script>
 
diff --git a/resources/views/themes/default1/admin/helpdesk/queue/index.blade.php b/resources/views/themes/default1/admin/helpdesk/queue/index.blade.php
index d671249e2..b2ff7c4e8 100644
--- a/resources/views/themes/default1/admin/helpdesk/queue/index.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/queue/index.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('emails-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('queue')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -47,13 +51,11 @@ class="active"
     {{Session::get('warn')}}
 </div>
 @endif
-<div class="box">
-    <div class="box-header">
-        <div class="box-title">
-            {!! Lang::get('lang.queues') !!}
-        </div>
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.queues') !!}</h3>
     </div>
-    <div class="box-body">
+    <div class="card-body">
         <table id="example2" class="table table-bordered table-striped">
             <thead>
                 <tr>
diff --git a/resources/views/themes/default1/admin/helpdesk/settings/email.blade.php b/resources/views/themes/default1/admin/helpdesk/settings/email.blade.php
index d54bfc966..be0c306ca 100644
--- a/resources/views/themes/default1/admin/helpdesk/settings/email.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/settings/email.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Emails')
-active
+class="nav-link active"
 @stop
 
-@section('settings-bar')
-active
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('email')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -29,43 +33,40 @@ class="active"
 @section('content')
 <!-- open a form -->
 {!! Form::model($emails,['url' => 'postemail/'.$emails->id, 'method' => 'PATCH']) !!}
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{{Lang::get('lang.email-settings')}}</h3>             
+<!-- 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.success') !!} !</b>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {!!Session::get('fails')!!}
+</div>
+@endif
+@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('sys_email'))
+    <li class="error-message-padding">{!! $errors->first('sys_email', ':message') !!}</li>
+    @endif
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{{Lang::get('lang.email-settings')}}</h3>             
     </div>
-    <div class="box-body">
-        <!-- 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.success') !!} !</b>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {!!Session::get('fails')!!}
-        </div>
-        @endif
-        @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('sys_email'))
-            <li class="error-message-padding">{!! $errors->first('sys_email', ':message') !!}</li>
-            @endif
-        </div>
-        @endif
-
-        <div class="row">
-        </div>
+    <div class="card-body">
         <!-- Accept All Emails:	CHECKBOX: Accept email from unknown Users  -->
         <div class="row">
             <div class="col-md-6">
@@ -94,7 +95,7 @@ class="active"
             </div>
         </div>
     </div>
-    <div class="box-footer">
+    <div class="card-footer">
         {!! Form::submit(Lang::get('lang.submit'),['class'=>'btn btn-primary'])!!}
     </div>
 </div>
diff --git a/resources/views/themes/default1/admin/layout/admin.blade.php b/resources/views/themes/default1/admin/layout/admin.blade.php
index b8b433df6..1472ab333 100644
--- a/resources/views/themes/default1/admin/layout/admin.blade.php
+++ b/resources/views/themes/default1/admin/layout/admin.blade.php
@@ -373,14 +373,14 @@
                                 </ul>
                             </li>
 
-                            <li class="nav-item">
+                            <li @yield('email-menu-parent') class="nav-item">
                                 
                                 <a href="#" @yield('Emails') class="nav-link">
                                     <i class="nav-icon fas fa-envelope"></i>
                                     <p>{!! Lang::get('lang.email') !!} <i class="fas fa-angle-left right"></i></p>
                                 </a>
 
-                                <ul class="nav nav-treeview">
+                                <ul @yield('email-menu-open') class="nav nav-treeview">
 
                                     <li class="nav-item">
                                         <a href="{{ url('emails') }}" @yield('emails') class="nav-link">
diff --git a/resources/views/themes/default1/common/template/edit.blade.php b/resources/views/themes/default1/common/template/edit.blade.php
index 601d4799f..d748de66a 100644
--- a/resources/views/themes/default1/common/template/edit.blade.php
+++ b/resources/views/themes/default1/common/template/edit.blade.php
@@ -1,80 +1,92 @@
 @extends('themes.default1.admin.layout.admin')
 
+@section('Emails')
+class="nav-link active"
+@stop
+
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
+@stop
+
+@section('template')
+class="nav-link active"
+@stop
+
 @section('PageHeader')
 <h1>{!! Lang::get('lang.templates') !!}</h1>
 @stop
 
 @section('content')
 {!! Form::model($template,['url'=>'templates/'.$template->id,'method'=>'patch']) !!}
-<div class="box box-primary">
-    <div class="box-header with-border">
+@if (count($errors) > 0)
+<div class="alert alert-danger">
+    <i class="fa fa-ban"></i>  
+    <strong>{!! Lang::get('lang.alert') !!} !</strong>
+    <ul>
+        @foreach ($errors->all() as $error)
+        <li>{{ $error }}</li>
+        @endforeach
+    </ul>
+</div>
+@endif
+@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
+<!-- fail lang -->
+@if(Session::has('fails'))
+<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>
+    {{Session::get('fails')}}
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
 
-        <h3 class="box-title">{{Lang::get('lang.edit_template')}}</h4>
+        <h3 class="card-title">{{Lang::get('lang.edit_template')}}</h3>
     </div>
-    <div class="box-body">
+    <div class="card-body">
         <div class="row">
-            <div class="col-md-12">
-                @if (count($errors) > 0)
-                <div class="alert alert-danger">
-                    <i class="fa fa-ban"></i>  
-                    <strong>{!! Lang::get('lang.alert') !!} !</strong>
-                    <ul>
-                        @foreach ($errors->all() as $error)
-                        <li>{{ $error }}</li>
-                        @endforeach
-                    </ul>
-                </div>
-                @endif
-                @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
-                <!-- fail lang -->
-                @if(Session::has('fails'))
-                <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>
-                    {{Session::get('fails')}}
-                </div>
-                @endif
-                <div class="row">
-                    <div class="col-md-12 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
-                        <!-- first name -->
-                        <p class="lead">{!! $template->name !!}</p>
-                    </div>
-                    <div class="col-md-4 form-group {{ $errors->has('type') ? 'has-error' : '' }}">
-                        <!-- last name -->
-                        {!! Form::label('type',Lang::get('lang.template-types'),['class'=>'required']) !!}<span style="color:red;">*</span>
-                        {!! Form::select('type',[''=>'Select','Type'=>$type],null,['class' => 'form-control']) !!}
-                    </div>
-                </div>
-                <div class="row">
-                    <div class="col-md-8 form-group {{ $errors->has('subject') ? 'has-error' : '' }}">
-                        {!! Form::label('subject',Lang::get('lang.subject')) !!}
-                        {!! Form::text('subject',null,['class' => 'form-control', 'id' =>'subject']) !!}
-                    </div>
-                    <div class="col-md-3 form-group" id = "use-subject">
-                        <br/>
-                        {!! Form::hidden('variable','0') !!}
-                        {!! Form::checkbox('variable','1') !!}
-                        {!! Form::label('subject',Lang::get('lang.use_subject')) !!}
-                    </div>
-                </div>
-                <div class="row">
-                    <div class="col-md-12 form-group {{ $errors->has('message') ? 'has-error' : '' }}">
-                        {!! Form::label('message',Lang::get('lang.content'),['class'=>'required']) !!}<span style="color:red;">*</span>
-                        {!! Form::textarea('message',null,['class'=>'form-control','id'=>'textarea']) !!}
-                    </div>
-                </div>
+            <div class="col-md-12 form-group {{ $errors->has('name') ? 'has-error' : '' }}">
+                <!-- first name -->
+                <p class="lead mb-0">{!! $template->name !!}</p>
+            </div>
+            <div class="col-md-4 form-group {{ $errors->has('type') ? 'has-error' : '' }}">
+                <!-- last name -->
+                {!! Form::label('type',Lang::get('lang.template-types'),['class'=>'required']) !!}<span style="color:red;">*</span>
+                {!! Form::select('type',[''=>'Select','Type'=>$type],null,['class' => 'form-control']) !!}
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-8 form-group {{ $errors->has('subject') ? 'has-error' : '' }}">
+                {!! Form::label('subject',Lang::get('lang.subject')) !!}
+                {!! Form::text('subject',null,['class' => 'form-control', 'id' =>'subject']) !!}
+            </div>
+            <div class="col-md-3 form-group" id = "use-subject" style="margin-top: 15px;">
+                <br/>
+                {!! Form::hidden('variable','0') !!}
+                {!! Form::checkbox('variable','1') !!}
+                {!! Form::label('subject',Lang::get('lang.use_subject')) !!}
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-12 form-group {{ $errors->has('message') ? 'has-error' : '' }}">
+                {!! Form::label('message',Lang::get('lang.content'),['class'=>'required']) !!}<span style="color:red;">*</span>
+                {!! Form::textarea('message',null,['class'=>'form-control','id'=>'textarea']) !!}
             </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/common/template/list-templates.blade.php b/resources/views/themes/default1/common/template/list-templates.blade.php
index 96699ff65..bdbf3d846 100644
--- a/resources/views/themes/default1/common/template/list-templates.blade.php
+++ b/resources/views/themes/default1/common/template/list-templates.blade.php
@@ -1,30 +1,47 @@
 @extends('themes.default1.admin.layout.admin')
 
+@section('Emails')
+class="nav-link active"
+@stop
+
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
+@stop
+
+@section('template')
+class="nav-link active"
+@stop
+
 @section('PageHeader')
 <h1>{!! Lang::get('lang.templates') !!}</h1>
 @stop
 
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.edit_templates') !!}</h3>
+ @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
+@if(Session::has('failed'))
+<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>
+    <p>{{Session::get('failed')}}</p>                
+</div>
+@endif
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.edit_templates') !!}</h3>
     </div><!-- /.box-header -->
-    <div class="box-body">
-        @if(Session::has('success'))
-        <div class="alert alert-success alert-dismissable">
-            <i class="fa fa-check"></i>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('success')}}
-        </div>
-        @endif
-        @if(Session::has('failed'))
-        <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>
-            <p>{{Session::get('failed')}}</p>                
-        </div>
-        @endif
+    <div class="card-body">
+       
         <table id="example1" class="table table-bordered table-striped">
             <thead>
                 <tr>
@@ -63,6 +80,4 @@ $(function() {
     });
 });
 </script>
-<script src="{{asset("lb-faveo/plugins/datatables/jquery.dataTables.js")}}" type="text/javascript"></script>
-<script src="{{asset("lb-faveo/plugins/datatables/dataTables.bootstrap.js")}}" type="text/javascript"></script>
 @stop
\ No newline at end of file
diff --git a/resources/views/themes/default1/common/template/sets.blade.php b/resources/views/themes/default1/common/template/sets.blade.php
index 2e5b46aa4..40ff9b94a 100644
--- a/resources/views/themes/default1/common/template/sets.blade.php
+++ b/resources/views/themes/default1/common/template/sets.blade.php
@@ -1,36 +1,54 @@
 @extends('themes.default1.admin.layout.admin')
 
+@section('Emails')
+class="nav-link active"
+@stop
+
+@section('email-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('email-menu-open')
+class="nav nav-treeview menu-open"
+@stop
+
+@section('template')
+class="nav-link active"
+@stop
+
 @section('PageHeader')
 <h1>{!! Lang::get('lang.template_set') !!}</h1>
 @stop
 
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.list_of_templates_sets') !!}</h3>
-        <div class="box-tools pull-right">
-            <button class="btn btn-box-tool" data-toggle="modal" data-target="#create" title="Create" id="2create"><i class="fa fa-plus-circle fa-2x"></i></button>
 
+@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
+
+@if(Session::has('failed'))
+<div class="alert alert-danger alert-dismissable">
+    <i class="fa fa-ban"></i>
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    <b>{!! Lang::get('lang.alert') !!} !</b> <br>
+    <li>{{Session::get('failed')}}</li>
+</div>
+@endif
+
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{!! Lang::get('lang.list_of_templates_sets') !!}</h3>
+        <div class="card-tools">
+            <button class="btn btn-default btn-tool" data-toggle="modal" data-target="#create" title="Create" id="2create">
+                <i class="fas fa-plus"> </i> Create
+            </button>
         </div>
     </div><!-- /.box-header -->
-    <div class="box-body">
-
-        @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
-
-        @if(Session::has('failed'))
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            <b>{!! Lang::get('lang.alert') !!} !</b> <br>
-            <li>{{Session::get('failed')}}</li>
-        </div>
-        @endif
+    <div class="card-body">
         <table id="example1" class="table table-bordered table-striped">
             <thead>
                 <tr>
@@ -80,8 +98,8 @@
                                 <div class="modal-content">
                                     {!! Form::model($set,['route'=>['template-sets.update', $set->id],'method'=>'PATCH','files' => true]) !!}
                                     <div class="modal-header">
-                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                         <h4 class="modal-title">{!! Lang::get('lang.edit_details') !!}</h4>
+                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                     </div>
                                     <div class="modal-body">
                                         <div class="form-group">
@@ -91,11 +109,10 @@
                                             </div>
                                         </div>
                                     </div>
-                                    <div class="modal-footer">
-                                        <div class="form-group">
-                                            {!! Form::submit('Update Details',['class'=>'btn btn-primary'])!!}
-                                            <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
-                                        </div></div>
+                                    <div class="modal-footer justify-content-between">
+                                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                                        {!! Form::submit('Update Details',['class'=>'btn btn-primary'])!!}
+                                    </div>
                                     {!! Form::close() !!}
                                 </div> 
                             </div>
@@ -108,19 +125,19 @@
                             $dis = "";
                         }
                         ?>
-                        <button class="btn btn-danger btn-sm {!! $dis !!}" data-toggle="modal" data-target="#{{$set->id}}delete">{!! Lang::get('lang.delete') !!}</button>
-                        <div class="modal fade" id="{{$set->id}}delete">
+                        <button class="btn btn-danger btn-sm {!! $dis !!}" data-toggle="modal" data-target="#delete{{$set->id}}">{!! Lang::get('lang.delete') !!}</button>
+                        <div class="modal fade" id="delete{{$set->id}}">
                             <div class="modal-dialog">
                                 <div class="modal-content">
                                     <div class="modal-header">
-                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                         <h4 class="modal-title">{!! Lang::get('lang.delete') !!}</h4>
+                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                     </div>
                                     <div class="modal-body">
-                                        <p>Are you sure you want to Delete ?</p>
+                                        <span>Are you sure you want to Delete ?</span>
                                     </div>
-                                    <div class="modal-footer">
-                                        <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
+                                    <div class="modal-footer justify-content-between">
+                                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                                         {!! link_to_route('sets.delete',Lang::get('lang.delete'),[$set->id],['id'=>'delete','class'=>'btn btn-danger btn-sm']) !!}
                                     </div>
                                 </div> 
@@ -139,13 +156,13 @@
         <div class="modal-content">
             {!! Form::open(['route'=>'template-sets.store']) !!}
             <div class="modal-header">
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                 <h4 class="modal-title">{!! Lang::get('lang.create') !!}</h4>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
             </div>
             <div class="modal-body">
                 @foreach ($errors->all() as $error)
                 <div class="alert alert-danger alert-dismissable">
-                    <i class="fa fa-ban"></i><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+                    <i class="fas fa-ban"></i><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
                     <b>{!! Lang::get('lang.alert') !!} !</b><br>
                     <li style="list-style: none">{{ $error }}</li>
                 </div>
@@ -162,11 +179,10 @@
                     {!! Form::text('name',null,['class'=>'form-control'])!!}
                 </div>
             </div>
-            <div class="modal-footer">
-                <div class="form-group">
-                    {!! Form::submit(Lang::get('lang.create_set'),['class'=>'btn btn-primary'])!!}
-                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal">{!! Lang::get('lang.close') !!}</button>
-                </div></div>
+            <div class="modal-footer justify-content-between">
+                <button type="button" class="btn btn-default" data-dismiss="modal">{!! Lang::get('lang.close') !!}</button>
+                {!! Form::submit(Lang::get('lang.create_set'),['class'=>'btn btn-primary'])!!}
+            </div>
             {!! Form::close() !!}
         </div> 
     </div>