diff --git a/app/FaveoLog/views/log.blade.php b/app/FaveoLog/views/log.blade.php
index 07d613385..d7a58e8f7 100644
--- a/app/FaveoLog/views/log.blade.php
+++ b/app/FaveoLog/views/log.blade.php
@@ -1,10 +1,6 @@
 @extends('themes.default1.admin.layout.admin')
 @section('Log')
-active
-@stop
-
-@section('logs')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -25,6 +21,7 @@ class="active"
 
     .stack {
         font-size: 0.85em;
+        font-style: italic;
     }
     .date {
         min-width: 75px;
@@ -37,14 +34,20 @@ class="active"
         background-color: #f5f5f5;
         border-color: #777;
     }
+    .list-group-item+.list-group-item {
+        border-top-width: 1px !important;
+    }
 </style>
 <div class="container-fluid">
-    <div class="box box-primary">
-        <div class="box-header with-border">
-            <h4>System Logs</h4>
-            
+    <div class="card card-light">
+        <div class="card-header">
+            <h3 class="card-title">System Logs</h3>
+            <div class="card-tools">
+                <a href="?dl={{ base64_encode($current_file) }}" class="btn btn-primary btn-sm text-white"><span class="fas fa-download"></span> Download file</a>
+                <a id="delete-log" href="?del={{ base64_encode($current_file) }}" class="btn btn-danger btn-sm text-white"><span class="fas fa-trash"></span> Delete file</a>
+            </div>
         </div>
-        <div class="box-body">
+        <div class="card-body">
             <div class="row">
                 <div class="col-md-2">
                     <div class="list-group">
@@ -74,7 +77,7 @@ class="active"
 
                             @foreach($logs as $key => $log)
                             <tr>
-                                <td class="text-{{{$log['level_class']}}}"><span class="glyphicon glyphicon-{{{$log['level_img']}}}-sign" aria-hidden="true"></span> &nbsp;{{ucfirst($log['level'])}}</td>
+                                <td class="text-{{{$log['level_class']}}}" style="width: 90px;"><span class="glyphicon glyphicon-{{{$log['level_img']}}}-sign" aria-hidden="true"></span> &nbsp;{{ucfirst($log['level'])}}</td>
                                 <td class="text">{{ucfirst($log['context'])}}</td>
                                 <td class="date">{{{$log['date']}}}</td>
                                 <td class="text">
@@ -89,11 +92,6 @@ class="active"
                         </tbody>
                     </table>
                     @endif
-                    <div>
-                        <a href="?dl={{ base64_encode($current_file) }}"><span class="glyphicon glyphicon-download-alt"></span> Download file</a>
-                        -
-                        <a id="delete-log" href="?del={{ base64_encode($current_file) }}"><span class="glyphicon glyphicon-trash"></span> Delete file</a>
-                    </div>
                 </div>
             </div>
         </div>
@@ -103,9 +101,6 @@ class="active"
 
 @stop
 @section('FooterInclude')
-<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>-->
-<!--<script src="https://cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>-->
-<script src="https://cdn.datatables.net/plug-ins/9dcbecd42ad/integration/bootstrap/3/dataTables.bootstrap.js"></script>
 <script>
 $(document).ready(function () {
     $('#table-log').DataTable({
diff --git a/app/Http/Controllers/Common/SettingsController.php b/app/Http/Controllers/Common/SettingsController.php
index 1690410dc..abe2b5d96 100644
--- a/app/Http/Controllers/Common/SettingsController.php
+++ b/app/Http/Controllers/Common/SettingsController.php
@@ -76,8 +76,8 @@ class SettingsController extends Controller
                             <form action="'.url('edit-widget/'.$model->id).'" method="POST">
                             '.csrf_field().'
                                 <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">'.strtoupper($model->name).' </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" style="width:100%">
@@ -90,13 +90,24 @@ class SettingsController extends Controller
                                         <textarea name="content" class="form-control" style="width:100%" id="Content'.$model->id.'">'.$model->value.'</textarea>
                                     </div>
                                 </div>
-                                <div class="modal-footer">
-                                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal" id="dismis2">'.\Lang::get('lang.close').'</button>
+                                <div class="modal-footer justify-content-between">
+                                    <button type="button" class="btn btn-default" data-dismiss="modal" id="dismis2">'.\Lang::get('lang.close').'</button>
                                     <input type="submit" class="btn btn-primary" value="'.\Lang::get('lang.update').'">
                                 </div>
                                 <script>
                                     $(function () {
-                                        $("#Content'.$model->id.'").wysihtml5();
+                                        $("#Content'.$model->id.'").summernote({
+                                        height: 300,
+                                        tabsize: 2,
+                                        toolbar: [
+                                        ["style", ["bold", "italic", "underline", "clear"]],
+                                        ["font", ["strikethrough", "superscript", "subscript"]],
+                                        ["fontsize", ["fontsize"]],
+                                        ["color", ["color"]],
+                                        ["para", ["ul", "ol", "paragraph"]],
+                                        ["height", ["height"]]
+                                      ]
+                                      });
                                     });
                                 </script>
                             </form>
@@ -164,18 +175,17 @@ class SettingsController extends Controller
                             <form action="'.url('edit-widget/'.$model->id).'" method="POST">
                             '.csrf_field().'
                                 <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">'.strtoupper($model->name).' </h4>
+                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                 </div>
                                 <div class="modal-body">
-                                    <br/>
                                     <div class="form-group" style="width:100%">
                                         <label>'.\Lang::get('lang.link').'</label><br/>
                                         <input type="url" name="content" class="form-control" style="width:100%" value="'.$model->value.'">
                                     </div>
                                 </div>
-                                <div class="modal-footer">
-                                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal" id="dismis2">'.\Lang::get('lang.close').'</button>
+                                <div class="modal-footer justify-content-between">
+                                    <button type="button" class="btn btn-default" data-dismiss="modal" id="dismis2">'.\Lang::get('lang.close').'</button>
                                     <input type="submit" class="btn btn-primary" value="'.\Lang::get('lang.update').'">
                                 </div>
                             </form>
diff --git a/resources/views/themes/default1/admin/helpdesk/settings/error-and-logs/error-debug.blade.php b/resources/views/themes/default1/admin/helpdesk/settings/error-and-logs/error-debug.blade.php
index 1c3fe075a..7ffc30920 100644
--- a/resources/views/themes/default1/admin/helpdesk/settings/error-and-logs/error-debug.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/settings/error-and-logs/error-debug.blade.php
@@ -1,15 +1,19 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('error-bugs')
-active
+class="nav-link active"
 @stop
 
-@section('settings-bar')
-active
+@section('error-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('error-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('debugging-option')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,61 +31,64 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-	<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{{Lang::get('lang.debug-options')}}</h3> 
+<!-- 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><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
+
+<div class="card card-light">
+
+    <div class="card-header">
+        <h3 class="card-title">{{Lang::get('lang.debug-options')}}</h3> 
     </div>
+
     <!-- Helpdesk Status: radio Online Offline -->
-    <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><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
+    <div class="card-body">
         {!! Form::open(['url' => route('post.error.debug.settings'), 'method' => 'POST']) !!}
         <div class="row">
             <div class="col-md-4">
                 <div class="form-group">
                     {!! Form::label('debug',Lang::get('lang.debugging')) !!}
                     <div class="row">
-                        <div class="col-xs-3">
+                        <div class="col-sm-3">
                             <input type="radio" name="debug" value="true" @if($debug == true) checked="true" @endif> {{Lang::get('lang.enable')}}
                         </div>
-                        <div class="col-xs-3">
+                        <div class="col-sm-3">
                             <input type="radio" name="debug" value="false" @if($debug == false) checked="true" @endif> {{Lang::get('lang.disable')}}
                         </div>
                     </div>
                 </div> 
             </div>
-            <div class="col-md-4">
+            <div class="col-md-6">
                 <div class="form-group">
                     {!! Form::label('bugsnag',Lang::get('lang.bugsnag-debugging')) !!}
                     <div class="row">
-                        <div class="col-xs-3">
+                        <div class="col-sm-3">
                             <input type="radio" name="bugsnag" value="true" @if($bugsnag == true) checked="true" @endif> {{Lang::get('lang.yes')}}
                         </div>
-                        <div class="col-xs-3">
+                        <div class="col-sm-3">
                             <input type="radio" name="bugsnag" value="false" @if($bugsnag == false) checked="true" @endif> {{Lang::get('lang.no')}}
                         </div>
                     </div>
                 </div> 
             </div>
         </div>
-        </div>
-         <div class="box-footer">
+    </div>
+    <div class="card-footer">
         {!! Form::submit(Lang::get('lang.save'),['onclick'=>'sendForm()','class'=>'btn btn-primary'])!!}
     </div>
-     {!! Form::close() !!}  
-        </div>
+    {!! Form::close() !!}  
+</div>
 @stop
\ No newline at end of file
diff --git a/resources/views/themes/default1/admin/helpdesk/settings/plugins.blade.php b/resources/views/themes/default1/admin/helpdesk/settings/plugins.blade.php
index 138d61143..5354307b9 100644
--- a/resources/views/themes/default1/admin/helpdesk/settings/plugins.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/settings/plugins.blade.php
@@ -1,15 +1,7 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Plugins')
-active
-@stop
-
-@section('settings-bar')
-active
-@stop
-
-@section('plugin')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,77 +19,75 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h3 class="box-title">{!! Lang::get('lang.plugins-list') !!}</h3>
-        <button type="button" class="btn btn-primary pull-right" id="Edit_Ticket" data-toggle="modal" data-target="#Edit"><b>{!! Lang::get('lang.add_plugin') !!}</b></button>        
-        <div class="modal fade" id="Edit">
-            <div class="modal-dialog">
-                <div class="modal-content">  
-                    <div class="modal-header">
-                        <h4 class="modal-title">{!! Lang::get('lang.add_plugin') !!}</h4>
-                    </div>
-                    <div class="modal-body">
-                        {!! Form::open(['url'=>'post-plugin','files'=>true]) !!}
-                        <label>{!! Lang::get('lang.plugin') !!} :</label> 
-                        <div class="btn bg-olive btn-file" style="color:blue">
-                            {!! Lang::get('lang.upload_file') !!}<input type="file" name="plugin">
-                        </div>
-                    </div><!-- /.modal-content -->   
-                    <div class="modal-footer">
-                        <button type="button" class="btn btn-default pull-left" data-dismiss="modal" id="dismis">{!! Lang::get('lang.close') !!}</button>
-                        <input type="submit" class="btn btn-primary pull-right" value="{!! Lang::get('lang.upload') !!}">
-                    </div>
-                    {!! Form::close() !!}
-                </div>
-            </div><!-- /.modal-dialog -->
-        </div><!-- /.modal -->
-    </div>
-    <div class="box-body">
-        <div class="alert alert-info alert-dismissable">
-            <i class="fa fa-info-circle"></i>
-            <b>{!! Lang::get('lang.plugin-info') !!}</b><br/>
-            <a href="http://www.faveohelpdesk.com/plugins/" target="_blank">{!!Lang::get('lang.click-here')!!}</a>&nbsp;{!!Lang::get('lang.plugin-info-pro')!!}
-        </div>
-        @if (count($errors) > 0)
-        <div class="alert alert-danger alert-dismissable">
-            <i class="fa fa-ban"></i>
-            <b>{!! Lang::get('lang.alert') !!}!</b><br/>
-            <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
-        <!-- failure message -->
-        @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">
-                <script src="{{asset('lb-faveo/plugins/jQuery/jQuery-2.1.4.min.js')}}" type="text/javascript"></script>
-                <script type="text/javascript" src="{{asset('lb-faveo/plugins/datatables/jquery.dataTables.js')}}"></script>
-                <script type="text/javascript" src="{{asset('lb-faveo/plugins/datatables/dataTables.bootstrap.js')}}"></script>
+<div class="alert alert-info alert-dismissable">
+    <i class="fas fa-info-circle"></i>
+    <span>{!! Lang::get('lang.plugin-info') !!}</span><br/>
+    <a href="http://www.faveohelpdesk.com/plugins/" target="_blank">{!!Lang::get('lang.click-here')!!}</a>&nbsp;{!!Lang::get('lang.plugin-info-pro')!!}
+</div>
+@if (count($errors) > 0)
+<div class="alert alert-danger alert-dismissable">
+    <i class="fas fa-ban"></i>
+    <b>{!! Lang::get('lang.alert') !!}!</b><br/>
+    <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="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.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="card-title">{!! Lang::get('lang.plugins-list') !!}</h3>
+        <div class="card-tools">
+            <button type="button" class="btn btn-default btn-tool" id="Edit_Ticket" data-toggle="modal" data-target="#Edit">
+                <i class="fas fa-plus"></i> {!! Lang::get('lang.add_plugin') !!}
+            </button> 
 
-                {!! Datatable::table()
-                ->addColumn('Name','Description','Author','Website','Version')       // these are the column headings to be shown
-                ->setUrl('getplugin')   // this is the route where data will be retrieved
-                ->render() !!}
-            </div>
+            <div class="modal fade" id="Edit">
+                <div class="modal-dialog">
+                    <div class="modal-content">  
+                        <div class="modal-header">
+                            <h4 class="modal-title">{!! Lang::get('lang.add_plugin') !!}</h4>
+                        </div>
+                        <div class="modal-body">
+                            {!! Form::open(['url'=>'post-plugin','files'=>true]) !!}
+                            <label>{!! Lang::get('lang.plugin') !!} :</label> 
+                            <div class="btn bg-olive btn-file" style="color:blue">
+                                {!! Lang::get('lang.upload_file') !!}<input type="file" name="plugin">
+                            </div>
+                        </div><!-- /.modal-content -->   
+                        <div class="modal-footer justify-content-between">
+                            <button type="button" class="btn btn-default" data-dismiss="modal" id="dismis">{!! Lang::get('lang.close') !!}</button>
+                            <input type="submit" class="btn btn-primary" value="{!! Lang::get('lang.upload') !!}">
+                        </div>
+                        {!! Form::close() !!}
+                    </div>
+                </div><!-- /.modal-dialog -->
+            </div><!-- /.modal -->           
         </div>
     </div>
+    <div class="card-body">
+        
+        {!! Datatable::table()
+        ->addColumn('Name','Description','Author','Website','Version')       // these are the column headings to be shown
+        ->setUrl('getplugin')   // this is the route where data will be retrieved
+        ->render() !!}
+    </div>
 </div>
 @stop
diff --git a/resources/views/themes/default1/admin/helpdesk/theme/social.blade.php b/resources/views/themes/default1/admin/helpdesk/theme/social.blade.php
index 22d3f8dad..5d83fcc1f 100644
--- a/resources/views/themes/default1/admin/helpdesk/theme/social.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/theme/social.blade.php
@@ -1,42 +1,47 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Themes')
-active
+class="nav-link active"
 @stop
 
-@section('theme-bar')
-active
+@section('widget-menu-parent')
+class="nav-item menu-open"
 @stop
 
-@section('socail')
-class="active"
+@section('widget-menu-open')
+class="nav nav-treeview menu-open"
 @stop
+
+@section('social')
+class="nav-link active"
+@stop
+
 @section('PageHeader')
 <h1>{!! Lang::get('lang.widgets') !!}</h1>
 @stop
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h4 class="box-title">{!! Lang::get('lang.social-widget-settings') !!} </h4>
+<!-- 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.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="card-title">{!! Lang::get('lang.social-widget-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.alert') !!} !</b> 
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('fails')}}
-        </div>
-        @endif
+    <div class="card-body">
         {!! Datatable::table()
         ->addColumn(Lang::get('lang.name'),
         Lang::get('lang.link'),
diff --git a/resources/views/themes/default1/admin/helpdesk/theme/widgets.blade.php b/resources/views/themes/default1/admin/helpdesk/theme/widgets.blade.php
index aeaf26654..1f49d5a94 100644
--- a/resources/views/themes/default1/admin/helpdesk/theme/widgets.blade.php
+++ b/resources/views/themes/default1/admin/helpdesk/theme/widgets.blade.php
@@ -1,42 +1,48 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('Themes')
-active
+class="nav-link active"
 @stop
 
-@section('theme-bar')
-active
+@section('widget-menu-parent')
+class="nav-item menu-open"
+@stop
+
+@section('widget-menu-open')
+class="nav nav-treeview menu-open"
 @stop
 
 @section('widget')
-class="active"
+class="nav-link active"
 @stop
+
 @section('PageHeader')
 <h1>{!! Lang::get('lang.widgets') !!}</h1>
 @stop
 @section('content')
-<div class="box box-primary">
-    <div class="box-header with-border">
-        <h4 class="box-title">{!! Lang::get('lang.widget-settings') !!} </h4>
+<!-- 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.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="card-title">{!! Lang::get('lang.widget-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.alert') !!} !</b> 
-            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-            {{Session::get('fails')}}
-        </div>
-        @endif
+    <div class="card-body">
+
         {!! Datatable::table()
         ->addColumn(Lang::get('lang.name'),
         Lang::get('lang.title'),
diff --git a/resources/views/themes/default1/admin/layout/admin.blade.php b/resources/views/themes/default1/admin/layout/admin.blade.php
index ababae3e0..d08519207 100644
--- a/resources/views/themes/default1/admin/layout/admin.blade.php
+++ b/resources/views/themes/default1/admin/layout/admin.blade.php
@@ -437,7 +437,7 @@
                                     <p>{!! Lang::get('lang.manage') !!} <i class="fas fa-angle-left right"></i></p>
                                 </a>
 
-                                <ul @yield('email-menu-open') class="nav nav-treeview">
+                                <ul @yield('manage-menu-open') class="nav nav-treeview">
 
                                     <li class="nav-item">
                                         <a href="{{url('helptopic')}}" @yield('help') class="nav-link">
@@ -603,14 +603,14 @@
                                 </ul>
                             </li>
 
-                            <li class="nav-item">
+                            <li @yield('error-menu-parent') class="nav-item">
                                 
                                 <a href="#" @yield('error-bugs') class="nav-link">
                                     <i class="nav-icon fas fa-heartbeat"></i>
                                     <p>{!! Lang::get('lang.error-debug') !!} <i class="fas fa-angle-left right"></i></p>
                                 </a>
                                 
-                                <ul class="nav nav-treeview">
+                                <ul @yield('error-menu-open') class="nav nav-treeview">
 
                                     <li class="nav-item">
                                         <a href="{{ route('err.debug.settings') }}" @yield('debugging-option') class="nav-link">
@@ -621,14 +621,14 @@
                                 </ul>
                             </li>
 
-                            <li class="nav-item">
+                            <li @yield('widget-menu-parent') class="nav-item">
                                 
                                 <a href="#" @yield('Themes') class="nav-link">
                                     <i class="nav-icon fas fa-chart-pie"></i>
                                     <p>{!! Lang::get('lang.widgets') !!} <i class="fas fa-angle-left right"></i></p>
                                 </a>
                                 
-                                <ul class="nav nav-treeview">
+                                <ul @yield('widget-menu-open') class="nav nav-treeview">
                                 
                                     <li class="nav-item">
                                         <a href="{{ url('widgets') }}" @yield('widget') class="nav-link">
@@ -638,7 +638,7 @@
                                     </li>
                                     
                                     <li class="nav-item">
-                                        <a href="{{ url('social-buttons') }}" @yield('socail') class="nav-link">
+                                        <a href="{{ url('social-buttons') }}" @yield('social') class="nav-link">
                                             <i class="nav-icon fas fa-cubes"></i> 
                                             <p>{!! Lang::get('lang.social') !!}</p>
                                         </a>
diff --git a/resources/views/themes/default1/common/api/settings.blade.php b/resources/views/themes/default1/common/api/settings.blade.php
index 401602354..3342dd207 100644
--- a/resources/views/themes/default1/common/api/settings.blade.php
+++ b/resources/views/themes/default1/common/api/settings.blade.php
@@ -1,15 +1,7 @@
 @extends('themes.default1.admin.layout.admin')
 
 @section('API')
-active
-@stop
-
-@section('settings-bar')
-active
-@stop
-
-@section('plugin')
-class="active"
+class="nav-link active"
 @stop
 
 @section('HeadInclude')
@@ -27,124 +19,136 @@ class="active"
 <!-- /breadcrumbs -->
 <!-- content -->
 @section('content')
-<div class="box box-primary">
+@if (count($errors) > 0)
+<div class="alert alert-danger">
+    <strong>Whoops!</strong> There were some problems with your input.<br><br>
+    <ul>
+        @foreach ($errors->all() as $error)
+        <li>{{ $error }}</li>
+        @endforeach
+    </ul>
+</div>
+@endif
+@if(Session::has('success'))
+<div class="alert alert-success alert-dismissable">
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('success')}}
+</div>
+@endif
+<!-- fail message -->
+@if(Session::has('fails'))
+<div class="alert alert-danger alert-dismissable">
+    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
+    {{Session::get('fails')}}
+</div>
+@endif
+
 {!! Form::open(['url'=>'api','method'=>'post','files'=>true]) !!}
-    <div class="box-header with-border">
-        <h3 class="box-title">{{Lang::get('lang.api_settings')}}</h3>     
-        
+<div class="card card-light">
+    <div class="card-header">
+        <h3 class="card-title">{{Lang::get('lang.api_settings')}}</h3>     
     </div>
-    <div class="box-body">
-        <div class="row">
-            <div class="col-md-12">
-                @if (count($errors) > 0)
-                <div class="alert alert-danger">
-                    <strong>Whoops!</strong> There were some problems with your input.<br><br>
-                    <ul>
-                        @foreach ($errors->all() as $error)
-                        <li>{{ $error }}</li>
-                        @endforeach
-                    </ul>
-                </div>
-                @endif
-                @if(Session::has('success'))
-                <div class="alert alert-success alert-dismissable">
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    {{Session::get('success')}}
-                </div>
-                @endif
-                <!-- fail message -->
-                @if(Session::has('fails'))
-                <div class="alert alert-danger alert-dismissable">
-                    <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>
-                    {{Session::get('fails')}}
-                </div>
-                @endif
-                        <h4>{!! Lang::get('lang.api_configurations') !!}</h4>
-        <!-- Guest user page Content -->
-        <div class="row">
-            <div class="col-md-3">
-                <div class="form-group {{ $errors->has('api_enable') ? 'has-error' : '' }}">
-                    {!! Form::label('api',Lang::get('lang.api')) !!}
-                    {!! $errors->first('api_enable', '<spam class="help-block">:message</spam>') !!}
-                    <div class="row">
-                        <div class="col-xs-5">
-                            <input type="radio" name="api_enable" value="1" @if($systems->api_enable ==1) checked @endif>&nbsp;{{Lang::get('lang.enable')}}
-                            <!-- {!! Form::radio('api_enable','1',true) !!} {{Lang::get('lang.enable')}} -->
+    <div class="card-body">
+
+        <div class="card card-light">
+            
+            <div class="card-header">
+                <h3 class="card-title">{!! Lang::get('lang.api_configurations') !!}</h3>
+            </div>
+
+            <div class="card-body">        
+                <!-- Guest user page Content -->
+                <div class="row">
+                    <div class="col-md-3">
+                        <div class="form-group {{ $errors->has('api_enable') ? 'has-error' : '' }}">
+                            {!! Form::label('api',Lang::get('lang.api')) !!}
+                            {!! $errors->first('api_enable', '<spam class="help-block">:message</spam>') !!}
+                            <div class="row">
+                                <div class="col-sm-5">
+                                    <input type="radio" name="api_enable" value="1" @if($systems->api_enable ==1) checked @endif>&nbsp;{{Lang::get('lang.enable')}}
+                                    <!-- {!! Form::radio('api_enable','1',true) !!} {{Lang::get('lang.enable')}} -->
+                                </div>
+                                <div class="col-sm-5">
+                                    <input type="radio" name="api_enable" value="0" @if($systems->api_enable == 0) checked @endif>&nbsp;{{Lang::get('lang.disable')}}
+                                    <!-- {!! Form::radio('api_enable','0') !!} {{Lang::get('lang.disable')}} -->
+                                </div>
+                            </div>
                         </div>
-                        <div class="col-xs-5">
-                            <input type="radio" name="api_enable" value="0" @if($systems->api_enable == 0) checked @endif>&nbsp;{{Lang::get('lang.disable')}}
-                            <!-- {!! Form::radio('api_enable','0') !!} {{Lang::get('lang.disable')}} -->
+                    </div>
+                    <div class="col-md-3">
+                        <div class="form-group {{ $errors->has('api_key_mandatory') ? 'has-error' : '' }}">
+                            {!! Form::label('api_key_mandatory',Lang::get('lang.api_key_mandatory')) !!}
+                            {!! $errors->first('api_key_mandatory', '<spam class="help-block">:message</spam>') !!}
+                            <div class="row">
+                                <div class="col-sm-5">
+                                    <input type="radio" name="api_key_mandatory" value="1" @if($systems->api_key_mandatory == 1) checked @endif>&nbsp;{{Lang::get('lang.enable')}}
+                                    <!-- {!! Form::radio('api_key_mandatory','1',true) !!} {{Lang::get('lang.enable')}} -->
+                                </div>
+                                <div class="col-sm-5">
+                                     <input type="radio" name="api_key_mandatory" value="0" @if($systems->api_key_mandatory == 0) checked @endif>&nbsp;{{Lang::get('lang.disable')}}
+                                    <!-- {!! Form::radio('api_key_mandatory','0') !!} {{Lang::get('lang.disable')}} -->
+                                </div>
+                            </div>
                         </div>
                     </div>
+                    <!-- Date and Time Format: text: required: eg - 03/25/2015 7:14 am -->
+                    <div class="col-md-3">
+                        <div class="form-group {{ $errors->has('api_key') ? 'has-error' : '' }}">
+                            {!! Form::label('api_key',Lang::get('lang.api_key')) !!}
+                            {!! $errors->first('api_key', '<spam class="help-block">:message</spam>') !!}
+                            {!! Form::text('api_key',$systems->api_key,['class' => 'form-control']) !!}
+                        </div>
+                    </div>
+                    <div class="col-md-3">
+                        <br/>
+                        <a class="btn btn-primary" id="generate" href="javascript:;" style="margin-top: 8px;"> <i class="fas fa-sync"> </i> {!! Lang::get('lang.generate_key') !!}</a>
+                    </div>
                 </div>
             </div>
-            <div class="col-md-3">
-                <div class="form-group {{ $errors->has('api_key_mandatory') ? 'has-error' : '' }}">
-                    {!! Form::label('api_key_mandatory',Lang::get('lang.api_key_mandatory')) !!}
-                    {!! $errors->first('api_key_mandatory', '<spam class="help-block">:message</spam>') !!}
-                    <div class="row">
-                        <div class="col-xs-5">
-                            <input type="radio" name="api_key_mandatory" value="1" @if($systems->api_key_mandatory == 1) checked @endif>&nbsp;{{Lang::get('lang.enable')}}
-                            <!-- {!! Form::radio('api_key_mandatory','1',true) !!} {{Lang::get('lang.enable')}} -->
-                        </div>
-                        <div class="col-xs-5">
-                             <input type="radio" name="api_key_mandatory" value="0" @if($systems->api_key_mandatory == 0) checked @endif>&nbsp;{{Lang::get('lang.disable')}}
-                            <!-- {!! Form::radio('api_key_mandatory','0') !!} {{Lang::get('lang.disable')}} -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-            <!-- Date and Time Format: text: required: eg - 03/25/2015 7:14 am -->
-            <div class="col-md-3">
-                <div class="form-group {{ $errors->has('api_key') ? 'has-error' : '' }}">
-                    {!! Form::label('api_key',Lang::get('lang.api_key')) !!}
-                    {!! $errors->first('api_key', '<spam class="help-block">:message</spam>') !!}
-                    {!! Form::text('api_key',$systems->api_key,['class' => 'form-control']) !!}
-                </div>
-            </div>
-            <div class="col-md-3">
-                <br/>
-                <a class="btn btn-primary" id="generate"> <i class="fa fa-refresh"> </i> {!! Lang::get('lang.generate_key') !!}</a>
-            </div>
         </div>
+
+        <div class="card card-light">
+            
+            <div class="card-header">
+                
+                <h3 class="card-title">{!! Lang::get('lang.webhooks') !!}</h3>
             </div>
-        </div>
-    </div>
-    <div class="box-footer">
-     <div class="row">
-            <div class="col-md-12">
-            <h4>{!! Lang::get('lang.webhooks') !!}</h4>
-        <div class="col-md-6">
-                    <div class="form-group {{ $errors->has('ticket_detail') ? 'has-error' : '' }}">
+
+            <div class="card-body">
+                
+                <div class="row">
+                    
+                    <div class="form-group col-md-6 {{ $errors->has('ticket_detail') ? 'has-error' : '' }}">
                         {!! Form::label('ticket_detail',Lang::get('lang.enter_url_to_send_ticket_details'),['class'=>'required']) !!}
                         {!! Form::text('ticket_detail',$ticket_detail,['class' => 'form-control','placeholder'=>'http://www.example.com']) !!}
-                        <p></p>
                     </div>
                 </div>
-                </div></div>
+            </div>
+        </div>
     </div>
-    <div class="box-footer">
+
+    <div class="card-footer">
         {!! Form::submit(Lang::get('lang.update'),['class'=>'btn btn-primary'])!!} 
     </div>
     {!! Form::close() !!}   
 </div>
+
 <a href="#" id="clickGenerate" data-toggle="modal" data-target="#generateModal"></a>    
 <div class="modal fade" id="generateModal">
     <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.api_key') !!}</h4>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
             </div>
             <div class="modal-body" id="messageBody">
             </div>
-            <div class="modal-footer" id="messageBody">
+            <div class="modal-footer">
                 <button type="button" class="btn btn-default" data-dismiss="modal" aria-label="Close">{!! Lang::get('lang.close') !!}</button>
             </div>
         </div><!-- /.modal-content -->
     </div><!-- /.modal-dialog -->
 </div><!-- /.modal -->
-<script src="{{asset("lb-faveo/js/ajax-jquery.min.js")}}"></script>
 <script type="text/javascript">
 jQuery(document).ready(function() {
 // Close a ticket
@@ -154,19 +158,19 @@ jQuery(document).ready(function() {
             url: "{!! url('generate-api-key') !!}",
             beforeSend: function() {
                 $("#generate").empty();
-                var message = "<i class='fa fa-refresh fa-spin'> </i>  <?php echo Lang::get('lang.generate_key'); ?>";
+                var message = "<i class='fas fa-sync fa-spin'> </i>  <?php echo Lang::get('lang.generate_key'); ?>";
                 $('#generate').html(message);
             },
             success: function(response) {
                 // alert(response);
 
                 $("#messageBody").empty();
-                var message = "<div class='alert alert-default' style='margin-bottom: -5px;'>Copy and paste in the api to set a different Api key</div> <br/><b>Api key</b> : " + response;
+                var message = "<div class='alert alert-info mb-0'>Copy and paste in the api to set a different Api key</div> <br/><b>Api key</b> : " + response;
                 $('#messageBody').html(message);
 
                 $('#clickGenerate').trigger("click");
                 $("#generate").empty();
-                var message = "<i class='fa fa-refresh'> </i>  <?php echo Lang::get('lang.generate_key'); ?>";
+                var message = "<i class='fas fa-sync'> </i>  <?php echo Lang::get('lang.generate_key'); ?>";
                 $('#generate').html(message);
             }
         })