diff --git a/docs/changelog.rst b/docs/changelog.rst
index c85cf11d15..06f38eb866 100644
--- a/docs/changelog.rst
+++ b/docs/changelog.rst
@@ -8,6 +8,7 @@ CHANGELOG
 **Improvements**
 
 - Remove overriding of SchemaRandonneeParser's filetype_name attribute (#4022)
+- Improve sync mobile and import views with current bootstrap style.
 - Docker image is now mirrored on github registry
 
 **Bug fixes**
@@ -951,7 +952,7 @@ In preparation for HD Views developments (PR #3298)
 
 !!!! Clear cache after update. You can do this by going to admin panel, "clearcache" section, then delete default / fat and api_v2 !!!!
 
-**Improvements**
+**Improvments**
 
 - Cache API v2 Detail endpoints and themes list endpoint
 - Sensitive areas are now computed with buffered geometries with settings SENSITIVE_AREA_INTERSECTION_MARGIN. Use ST_INTERSECTS on it is faster.
diff --git a/geotrek/api/templates/mobile/sync_mobile.html b/geotrek/api/templates/mobile/sync_mobile.html
index f689781660..9b6425e0dd 100644
--- a/geotrek/api/templates/mobile/sync_mobile.html
+++ b/geotrek/api/templates/mobile/sync_mobile.html
@@ -32,29 +32,29 @@
 			    	    	  has_progress = true;
 			    	    	  disable_sync_button(false);
 
-			    	    	  $('#progress-value').show();
-			    	    	  $("#progress-value").removeClass('bar-danger');
-			    	    	  $("#progress-value").parent().addClass("active");
+			    	    	  $("#progress-bar").removeClass('bg-danger');
+                              $("#progress-bar").parent().addClass("active");
 
 			    	    	  if (this.result.current) {
-			    	    		  $("#progress-value").css("width", this.result.current+'%');
+			    	    		  $("#progress-bar").css("width", this.result.current + '%');
 
-			    	    		  if (this.result.current == 100){
-			    	    			  $("#progress-value").parent().removeClass("active");
-			    	    			  $("#progress-value").addClass('bar-success');
-			    	    		  }
+			    	    		  if (this.result.current == 100) {
+                                    $("#progress-bar").parent().removeClass("active");
+                                    $("#progress-bar").addClass('bg-success');
+                                }
 			    	    	  }
 			    	    	  if (this.result.infos) {
-			    	    		  $("#progress-text").text(this.result.infos);
-			    	    	  }
+                                $("#progress-bar").text(this.result.infos);
+                            }
 			    	      }
 			    	      else {
 			    	    	  if (this.status == 'FAILURE'){
 			    	    		  // case of exception in task
-			    	    		  $("#progress-text").text("{% trans 'An error occured' %}");
-			    	    		  $('#exception-message').text(this.result.exc_type + ' : ' + this.result.exc_message)
-			    	    		  $("#progress-value").addClass('bar-danger');
-			    	    		  $("#progress-value").parent().removeClass("active");
+                                $("#progress-bar").text("{% trans 'An error occured' %}");
+                                $('#exception-message').text(this.result.exc_type + ' : ' + this.result.exc_message)
+                                $('#exception-message').show();
+                                $("#progress-bar").addClass('bg-danger');
+                                $("#progress-value").parent().removeClass("active");
 			    	    	  }
 			    	      }
 			    	  });
@@ -70,11 +70,12 @@
 			get_sync_infos();
 
 			$('#btn-confirm')[0].addEventListener('click', function(evt) {
-				$("#progress-value").css("width", '0%');
-				$("#progress-text").text('');
-				$("#progress-value").parent().addClass("active");
-				$("#progress-value").removeClass('bar-success');
-				$("#progress-value").removeClass('bar-danger');
+                $('#exception-message').hide();
+				$("#progress-bar").css("width", '0%');
+                $("#progress-bar").text('');
+                $("#progress-bar").parent().addClass("active");
+                $("#progress-bar").removeClass('bg-success');
+                $("#progress-bar").removeClass('bg-danger');
 
 			    $.post(
 			        $('#form-sync').attr('action'),
@@ -87,10 +88,10 @@
 
 			window.setInterval(function(){
 				get_sync_infos();
-			}, 500);
+			}, 1000);
 		});
 	</script>
-	<link rel="stylesheet" href="{% static 'trekking/css/sync_trek.css' %}" />
+	<link rel="stylesheet" href="{% static 'common/css/sync.css' %}" />
 {% endblock extrahead %}
 
 {% block toolbar %}
@@ -98,22 +99,31 @@
 
 {% block mainpanel %}
 
-	<div id="sync-div" class="col-12 col-sm-3">
-	    <h3>{% trans "Mobile sync" %}</h3>
-		<div class="progress progress-striped active">
-		  <div id="progress-value" class="bar" style="width: 0%;"></div>
-		  <span id="progress-text"></span>
-		</div>
-		{% block mainform %}
-			{% crispy form form.helper %}
-		{% endblock mainform %}
+	<div id="sync-div" class="col-12 col-md-6 offset-md-3">
+        <div class="card">
+            <div class="card-header">
+                <h3>{% trans "Mobile sync" %}</h3>
+            </div>
+
+            <div class="card-body">
+                <div class="progress">
+                    <div class="progress-bar progress-bar-striped" style="width: 0;" id="progress-bar"  role="progressbar"></div>
+                </div>
+                <div id="exception-message" style="display: none;" class="alert alert-danger">
+                </div>
+            </div>
+            <div class="card-footer">
+                {% block mainform %}
+                    {% crispy form form.helper %}
+                {% endblock mainform %}
+            </div>
+        </div>
 	</div>
 
 	<div id="exception-message" style="display: none;">
 	</div>
 
 	<div class="modal fade" id="confirm-submit" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-	    <!-- boostrap 2 modal confirmation -->
 	    <div class="modal-dialog">
 	        <div class="modal-content">
 	            <div class="modal-header">
diff --git a/geotrek/common/static/common/css/import.css b/geotrek/common/static/common/css/import.css
index 0a46011a5f..65ba3fc801 100644
--- a/geotrek/common/static/common/css/import.css
+++ b/geotrek/common/static/common/css/import.css
@@ -9,12 +9,10 @@
 }
 
 #progress-bars div.alert {
-	margin-left: 45px;
 	display: none;
 }
 
 #progress-bars div.description {
-	margin-left: 45px;
 }
 
 #progress-bars span.parser{
diff --git a/geotrek/trekking/static/trekking/css/sync_trek.css b/geotrek/common/static/common/css/sync.css
similarity index 100%
rename from geotrek/trekking/static/trekking/css/sync_trek.css
rename to geotrek/common/static/common/css/sync.css
diff --git a/geotrek/common/static/common/js/import.js b/geotrek/common/static/common/js/import.js
index 3dfe34ca34..a1ebf63d65 100644
--- a/geotrek/common/static/common/js/import.js
+++ b/geotrek/common/static/common/js/import.js
@@ -2,38 +2,42 @@ function updateImportProgressBars() {
 	$.getJSON('/commands/import-update.json', function(json) {
 		parent = document.querySelector('#progress-bars');
 		json.forEach(function(row) {
-			var local_percent = row.result.current + "%";
-			var status_class = 'pogress-info';
-
-			if (row.status == 'SUCCESS') {
-				local_percent = "100%";
-				status_class = "progress-success";
-			} else if (row.status == 'FAILURE') {
-				local_percent = "100%";
-				status_class = "progress-danger";
+			var local_percent = row.result.current;
+			var status_class = '';
+
+			if (row.status === 'SUCCESS') {
+				local_percent = "100";
+				status_class = "bg-success";
+			} else if (row.status === 'FAILURE') {
+				local_percent = "100";
+				status_class = "bg-danger";
 			}
 
 			// Update element if exists
 			if (element = document.getElementById(row.id)) {
-				element.querySelector('.bar').style.width = local_percent;
-				element.querySelector('.pull-left').innerHTML = local_percent;
+				element.querySelector('.progress-bar').setAttribute('style', 'width: ' + local_percent + '% ;');
+				element.querySelector('.progress-bar').setAttribute('aria-valuenow', local_percent);
+				element.querySelector('.progress-bar').innerHTML = local_percent + "%";
 
 				if(!element.querySelector('.alert').classList.contains('alert-success')) {					
 					// Add report if success.
 					if (row.result.report) {
                         alert = element.querySelector('.alert');
 						alert.classList.add('alert-success');
-						alert.innerHTML = row.result.report;
+						message = element.querySelector('.message');
+						message.innerHTML = row.result.report;
 						alert.style.display = 'block';
 					}
 				}
 
 			} else { //Create element in dom.
 				element = document.createElement('div');
-				element.innerHTML = document.querySelector('#import-template').innerHTML
+				element.innerHTML = document.querySelector('#import-template').innerHTML;
 				element.id = row.id;
-				element.querySelector('.bar').style.width = local_percent + ' : ';
-				element.querySelector('.pull-left').innerHTML = local_percent;
+				element.querySelector('.progress-bar').setAttribute('style', 'width: ' + local_percent + '% ;');
+				element.querySelector('.progress-bar').setAttribute('aria-valuenow', local_percent);
+				element.querySelector('.progress-bar').innerHTML = local_percent + "%";
+
 				element.querySelector('.parser').innerHTML = row.result.parser;
                 element.querySelector('.filename').innerHTML = row.result.filename;
 
@@ -43,13 +47,13 @@ function updateImportProgressBars() {
 			// Handle errors if any.
 			if (row.result.exc_message) {
 				element.querySelector('.alert').classList.add('alert-danger');
-				element.querySelector('.alert span').innerHTML = row.result.exc_type + " : " + row.result.exc_message;
+				element.querySelector('.message span').innerHTML = row.result.exc_type + " : " + row.result.exc_message;
 				element.querySelector('.alert').style.display = 'block';
 			}
 
 			// Add class on status change.
-			if (!element.querySelector('.progress').classList.contains(status_class)) {
-				element.querySelector('.progress').classList.add(status_class);
+			if (!element.querySelector('.progress-bar').classList.contains(status_class)) {
+				element.querySelector('.progress-bar').classList.add(status_class);
 			}
 		});
 });
diff --git a/geotrek/common/templates/common/import_dataset.html b/geotrek/common/templates/common/import_dataset.html
index ba592443eb..e698b76dc5 100644
--- a/geotrek/common/templates/common/import_dataset.html
+++ b/geotrek/common/templates/common/import_dataset.html
@@ -2,56 +2,53 @@
 {% load static crispy_forms_tags i18n %}
 
 {% block extrahead %}
-<script type="text/javascript" src="{% static "common/js/import.js" %}"></script>
-<link rel="stylesheet" href="{% static "common/css/import.css" %}" />
+    <script type="text/javascript" src="{% static "common/js/import.js" %}"></script>
+    <link rel="stylesheet" href="{% static "common/css/import.css" %}"/>
 {% endblock extrahead %}
 
 {% block toolbar %}
 {% endblock toolbar %}
 
 {% block mainpanel %}
-<div id="import-forms" class="col-12 col-sm-3">
-	{% block mainform %}
-	{% if form %}
-		{% crispy form form.helper %}
-	{% endif %}
-	{% if encoding_error %}
-		<p style="color: red;">
-			{% trans "Decoding error. Please check encoding and use only ASCII in file names." %}
-		</p>
-	{% endif %}
-	{% if form_without_file %}
-		{% crispy form_without_file form_without_file.helper%}
-	{% endif %}
-	{% if form_suricate %}
-		{% crispy form_suricate form_suricate.helper%}
-	{% endif %}
-	{% if not form and not form_without_file and not form_suricate %}
-		<p>{% trans "No parser available." %}</p>
-	{% endif %}
-	{% endblock mainform %}
-</div>
-<div id="progress-bars" class="col-12 col-sm-5">
-</div>
+    <div id="import-forms" class="col-12 col-md-6 offset-md-3">
+        {% block mainform %}
+            {% if form %}
+                {% crispy form form.helper %}
+            {% endif %}
+            {% if encoding_error %}
+                <p style="color: red;">
+                    {% trans "Decoding error. Please check encoding and use only ASCII in file names." %}
+                </p>
+            {% endif %}
+            {% if form_without_file %}
+                {% crispy form_without_file form_without_file.helper %}
+            {% endif %}
+            {% if form_suricate %}
+                {% crispy form_suricate form_suricate.helper %}
+            {% endif %}
+            {% if not form and not form_without_file and not form_suricate %}
+                <p>{% trans "No parser available." %}</p>
+            {% endif %}
+        {% endblock mainform %}
+        <div id="progress-bars" class="col-12">
+        </div>
+    </div>
 
-<script id="import-template" type="text/template">
-	<div id="progress-tpl">
-		<button type="button" class="close" data-dismiss="alert">&times;</button>
-		<div class="description">
-			<span class="parser"></span>
-			<span class="filename">
-			</span>
-		</div>
-		<div class="pull-left">
-			<span></span>
-		</div>
-		<div class="progress progress-striped active">
-			<div class="bar"></div>
-		</div>
-		<div class="alert">
-			<span></span>
-		</div>
-		<hr></hr>
-	</div>
-</script>
+    <script id="import-template" type="text/template">
+        <div id="progress-tpl">
+            <div class="description">
+                <span class="parser"></span>
+                <span class="filename"></span>
+            </div>
+            <div class="progress">
+              <div class="progress-bar progress-bar-striped" role="progressbar" style="width: 0%" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
+            </div>
+            <div class="alert alert-warning alert-dismissible fade show" role="alert">
+                <span class="message"></span>
+              <button type="button" class="close" data-dismiss="alert" aria-label="Close">
+                <span aria-hidden="true">&times;</span>
+              </button>
+            </div>
+        </div>
+    </script>
 {% endblock mainpanel %}
diff --git a/geotrek/common/templates/common/sync_rando.html b/geotrek/common/templates/common/sync_rando.html
new file mode 100644
index 0000000000..e69de29bb2
diff --git a/geotrek/common/tests/test_views.py b/geotrek/common/tests/test_views.py
index 7ebb8bfd6a..eb14352edc 100644
--- a/geotrek/common/tests/test_views.py
+++ b/geotrek/common/tests/test_views.py
@@ -30,6 +30,7 @@
 from geotrek.core.models import Path
 from geotrek.trekking.models import Trek
 from geotrek.trekking.tests.factories import TrekFactory
+import geotrek.trekking.parsers  # noqa
 
 
 class DocumentPublicPortalTest(TestCase):
@@ -108,6 +109,7 @@ class ViewsTest(TestCase):
     @classmethod
     def setUpTestData(cls):
         cls.user = UserFactory.create()
+        cls.super_user = SuperUserFactory()
 
     def setUp(self):
         self.client.force_login(user=self.user)
@@ -118,14 +120,19 @@ def test_settings_json(self):
         self.assertEqual(response.status_code, 200)
 
     def test_admin_check_extents(self):
+        """ Admin can access to extents view"""
         url = reverse('common:check_extents')
-        response = self.client.get(url)
-        self.assertEqual(response.status_code, 302)
-        self.user.is_superuser = True
-        self.user.save()
+        self.client.force_login(self.super_user)
         response = self.client.get(url)
         self.assertEqual(response.status_code, 200)
 
+    def test_simple_user_check_extents(self):
+        """ Simple user can't access to extents view"""
+        url = reverse('common:check_extents')
+        self.client.force_login(self.user)
+        response = self.client.get(url)
+        self.assertEqual(response.status_code, 302)
+
     @override_settings(COLUMNS_LISTS={})
     @mock.patch('geotrek.common.mixins.views.logger')
     def test_custom_columns_mixin_error_log(self, mock_logger):
@@ -145,6 +152,9 @@ def setUpTestData(cls):
         cls.user = UserFactory()
         cls.super_user = SuperUserFactory()
 
+    def setUp(self):
+        self.client.force_login(user=self.user)
+
     def test_import_form_access(self):
         self.client.force_login(user=self.user)
         url = reverse('common:import_dataset')
diff --git a/geotrek/common/views.py b/geotrek/common/views.py
index f6b4852bce..2f2aab8edd 100644
--- a/geotrek/common/views.py
+++ b/geotrek/common/views.py
@@ -1,26 +1,27 @@
 import ast
 import json
+import logging
 import mimetypes
 import os
 import re
 from datetime import timedelta
 from zipfile import ZipFile, is_zipfile
 
-import logging
 import redis
 from django.apps import apps
 from django.conf import settings
 from django.contrib import messages
 from django.contrib.admin.models import CHANGE, LogEntry
-from django.contrib.auth.decorators import (login_required,
-                                            permission_required,
-                                            user_passes_test)
+from django.contrib.auth.decorators import (
+    login_required,
+    permission_required,
+    user_passes_test,
+)
 from django.contrib.auth.mixins import LoginRequiredMixin
 from django.contrib.gis.db.models import Extent, GeometryField
 from django.core.exceptions import PermissionDenied
 from django.db.models.functions import Cast
-from django.http import (Http404, HttpResponse, HttpResponseRedirect,
-                         JsonResponse)
+from django.http import Http404, HttpResponse, HttpResponseRedirect, JsonResponse
 from django.shortcuts import get_object_or_404, redirect, render
 from django.urls import reverse
 from django.utils import timezone
@@ -28,12 +29,16 @@
 from django.utils.encoding import force_str
 from django.utils.translation import gettext as _
 from django.views import static
-from django.views.defaults import page_not_found
 from django.views.decorators.http import require_http_methods, require_POST
+from django.views.defaults import page_not_found
 from django.views.generic import TemplateView, UpdateView, View
 from django_celery_results.models import TaskResult
 from django_large_image.rest import LargeImageFileDetailMixin
-from geotrek.common.filters import HDViewPointFilterSet
+from geotrek import __version__
+from geotrek.altimetry.models import Dem
+from geotrek.celery import app as celery_app
+from geotrek.core.models import Path
+from geotrek.feedback.parsers import SuricateParser
 from large_image import config
 from mapentity import views as mapentity_views
 from mapentity.helpers import api_bbox
@@ -41,27 +46,34 @@
 from mapentity.views import MapEntityList
 from paperclip import settings as settings_paperclip
 from paperclip.views import _handle_attachment_form
-from rest_framework import mixins
-from rest_framework import viewsets
-
-from geotrek import __version__
-from geotrek.celery import app as celery_app
-from geotrek.common.viewsets import GeotrekMapentityViewSet
-from geotrek.feedback.parsers import SuricateParser
-
-from ..altimetry.models import Dem
-from ..core.models import Path
-from .forms import (AttachmentAccessibilityForm, HDViewPointAnnotationForm,
-                    HDViewPointForm, ImportDatasetForm,
-                    ImportDatasetFormWithFile, ImportSuricateForm)
-from .mixins.views import BookletMixin, CompletenessMixin, DocumentPortalMixin, DocumentPublicMixin
+from rest_framework import mixins, viewsets
+
+from .filters import HDViewPointFilterSet
+from .forms import (
+    AttachmentAccessibilityForm,
+    HDViewPointAnnotationForm,
+    HDViewPointForm,
+    ImportDatasetForm,
+    ImportDatasetFormWithFile,
+    ImportSuricateForm,
+)
+from .mixins.views import (
+    BookletMixin,
+    CompletenessMixin,
+    DocumentPortalMixin,
+    DocumentPublicMixin,
+)
 from .models import AccessibilityAttachment, HDViewPoint
 from .permissions import PublicOrReadPermMixin, RelatedPublishedPermission
-from .serializers import HDViewPointGeoJSONSerializer, HDViewPointSerializer, HDViewPointAPISerializer
+from .serializers import (
+    HDViewPointAPISerializer,
+    HDViewPointGeoJSONSerializer,
+    HDViewPointSerializer,
+)
 from .tasks import import_datas, import_datas_from_web
 from .utils import leaflet_bounds
-from .utils.import_celery import (create_tmp_destination,
-                                  discover_available_parsers)
+from .utils.import_celery import create_tmp_destination, discover_available_parsers
+from .viewsets import GeotrekMapentityViewSet
 
 logger = logging.getLogger(__name__)