diff --git a/themes/tps/assets/css/components/2-layout/modal.scss b/themes/tps/assets/css/components/2-layout/modal.scss
index 3e7fe27..1eea5fe 100644
--- a/themes/tps/assets/css/components/2-layout/modal.scss
+++ b/themes/tps/assets/css/components/2-layout/modal.scss
@@ -27,7 +27,7 @@
         @include transform;
         max-width: 900px;
         width: calc(100% - 120px);
-        max-height: calc(100% - 150px);
+        max-height: 450px;
         height: calc(100% - 150px);
         padding: 70px 50px;
         background: rgba(0, 0, 0, .5);
diff --git a/themes/tps/assets/css/components/3-page/portfolio.scss b/themes/tps/assets/css/components/3-page/portfolio.scss
index dd36a72..5f81ca2 100644
--- a/themes/tps/assets/css/components/3-page/portfolio.scss
+++ b/themes/tps/assets/css/components/3-page/portfolio.scss
@@ -54,6 +54,7 @@
 
     &_box {
         display: flex;
+        flex-wrap: wrap;
         margin: 50px -1px;
 
         &-item {
diff --git a/themes/tps/assets/css/main.css b/themes/tps/assets/css/main.css
index 41d692e..67a63d9 100644
--- a/themes/tps/assets/css/main.css
+++ b/themes/tps/assets/css/main.css
@@ -833,7 +833,7 @@ svg.active .svg-elem-21 {
   -webkit-transform: translate(-50%, -50%);
   max-width: 900px;
   width: calc(100% - 120px);
-  max-height: calc(100% - 150px);
+  max-height: 450px;
   height: calc(100% - 150px);
   padding: 70px 50px;
   background: rgba(0, 0, 0, 0.5);
@@ -1957,6 +1957,8 @@ svg.active .svg-elem-21 {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
   margin: 50px -1px;
 }
 .gallery_box-item {
diff --git a/themes/tps/pages/portfolio.htm b/themes/tps/pages/portfolio.htm
index 2bc2646..190800d 100755
--- a/themes/tps/pages/portfolio.htm
+++ b/themes/tps/pages/portfolio.htm
@@ -1,5 +1,5 @@
 title = "Портфолио"
-url = "/portfolio"
+url = "/portfolio/:page?"
 layout = "master"
 description = "На счету TPS сотни успешно реализованных проектов любой сложности. Наши заказчики – локальные и международные компании.
 
@@ -17,12 +17,20 @@ displayColumn = "id"
 noRecordsMessage = "No records found"
 detailsPage = "-"
 detailsUrlParameter = "id"
+recordsPerPage = 6
 pageNumber = "{{ :page }}"
 ==
 {% put styles %}
      <link rel="stylesheet" href="{{'assets/css/jquery.fancybox.min.css'|theme}}">
+     <style>
+         .activePage{
+            color: #2B72B6;
+            font-weight: 700 !important; 
+            }
+     </style>
 {% endput %}
 
+
 {% partial 'header' %}
 
 {% set records = builderList.records %}
@@ -101,9 +109,9 @@ pageNumber = "{{ :page }}"
                
                       <div class="gallery_box-item">
                             <div class="gal_slider">
-                                {% for cont in record.img %}
+                                {% for keyq, cont in record.img %}
                                     <div class="gal_slider-item fancybox" href="{{ cont.content|media }}"
-                                        data-fancybox="images-preview-1" data-width="1500" data-height="1000">
+                                        data-fancybox="images-preview-{{ keyq + 1 }}" data-width="1500" data-height="1000">
                                         <img src="{{ cont.content|media }}" alt="gal-img">
                                     </div>
                                 {% endfor %}
@@ -119,9 +127,9 @@ pageNumber = "{{ :page }}"
                             </div>
         
                             <div style="display: none;">
-                                {% for cont in record.img %}
+                                {% for keyq, cont in record.img %}
                                     <a href="{{ cont.content|media }}" data-fancybox-arrows="true" data-arrows="true"
-                                        data-fancybox="images-preview-1" data-width="1500" data-height="1000"
+                                        data-fancybox="images-preview-{{ keyq + 1 }}" data-width="1500" data-height="1000"
                                         data-thumb="{{ cont.content|media }}"></a>
                                 {% endfor %}
                             </div>
@@ -130,32 +138,45 @@ pageNumber = "{{ :page }}"
                 
                 
             </div>          
+
             
+            
+             {% if records.lastPage > 1 %}
             <div class="pagination">
-                <a href="#" class="pag_arrow left">
+            {% if records.currentPage > 1 %}
+                <a href="{{ this.page.baseFileName|page({ (pageParam): (records.currentPage-1) }) }}" class="pag_arrow left">
                     <svg width="20" height="8" viewBox="0 0 20 8" fill="none" xmlns="http://www.w3.org/2000/svg">
                         <path
                             d="M0.0746269 6.6951C0.113373 6.59733 0.167772 6.50602 0.237822 6.42636L5.65404 0.267381C5.96755 -0.089127 6.48647 -0.089127 6.79998 0.267381C7.11349 0.623889 7.11349 1.21397 6.79998 1.57048L2.7675 6.15597H19.1892C19.6324 6.15597 20 6.57395 20 7.07797C20 7.582 19.6324 7.99998 19.1892 7.99998H0.81081C0.795755 7.99998 0.780788 7.99949 0.765919 7.99854C0.575689 7.98686 0.38817 7.90043 0.237822 7.72946C0.168755 7.65092 0.114901 7.56105 0.0762653 7.46483C0.0274029 7.3468 0 7.21559 0 7.07797C0 6.9419 0.0267906 6.8121 0.0746269 6.6951Z"
                             fill="#2B72B6" />
                     </svg>
                 </a>
-
-                <p class="pag_txt">
-                    <span>
-                        1
-                    </span>
-                    /
-                    100
-                </p>
-
-                <a href="#" class="pag_arrow right">
-                    <svg width="20" height="8" viewBox="0 0 20 8" fill="none" xmlns="http://www.w3.org/2000/svg">
-                        <path
-                            d="M19.9254 6.6951C19.8866 6.59733 19.8322 6.50602 19.7622 6.42636L14.346 0.267381C14.0324 -0.089127 13.5135 -0.089127 13.2 0.267381C12.8865 0.623889 12.8865 1.21397 13.2 1.57048L17.2325 6.15597H0.810812C0.367569 6.15597 0 6.57395 0 7.07797C0 7.582 0.367569 7.99998 0.810812 7.99998H19.1892C19.2042 7.99998 19.2192 7.99949 19.2341 7.99854C19.4243 7.98686 19.6118 7.90043 19.7622 7.72946C19.8312 7.65092 19.8851 7.56105 19.9237 7.46483C19.9726 7.3468 20 7.21559 20 7.07797C20 6.9419 19.9732 6.8121 19.9254 6.6951Z"
-                            fill="#2B72B6" />
-                    </svg>
-                </a>
-            </div>
+            {% endif %}
+            
+            
+            {% for page in 1..records.lastPage %}
+                
+                 <p class="pag_txt">
+                     <a class=" {{ records.currentPage == page ? 'activePage' : null }}" href="{{ this.page.baseFileName|page({ (pageParam): page }) }}">{{ page }}</a>
+                 </p>
+                
+            {% endfor %}
+            
+               
+              {% if records.lastPage > records.currentPage %}
+                    <a href="{{ this.page.baseFileName|page({ (pageParam): (records.currentPage+1) }) }}" class="pag_arrow right">
+                        <svg width="20" height="8" viewBox="0 0 20 8" fill="none" xmlns="http://www.w3.org/2000/svg">
+                            <path
+                                d="M19.9254 6.6951C19.8866 6.59733 19.8322 6.50602 19.7622 6.42636L14.346 0.267381C14.0324 -0.089127 13.5135 -0.089127 13.2 0.267381C12.8865 0.623889 12.8865 1.21397 13.2 1.57048L17.2325 6.15597H0.810812C0.367569 6.15597 0 6.57395 0 7.07797C0 7.582 0.367569 7.99998 0.810812 7.99998H19.1892C19.2042 7.99998 19.2192 7.99949 19.2341 7.99854C19.4243 7.98686 19.6118 7.90043 19.7622 7.72946C19.8312 7.65092 19.8851 7.56105 19.9237 7.46483C19.9726 7.3468 20 7.21559 20 7.07797C20 6.9419 19.9732 6.8121 19.9254 6.6951Z"
+                                fill="#2B72B6" />
+                        </svg>
+                    </a>
+                   {% endif %}
+                   
+                </div>
+               {% endif %}
+               
+               
         </div>
     </div>
 </section>