diff --git a/src/app/_modules/pages/sections/item/page-section.component.scss b/src/app/_modules/pages/sections/item/page-section.component.scss
index 43813e3..8b13789 100644
--- a/src/app/_modules/pages/sections/item/page-section.component.scss
+++ b/src/app/_modules/pages/sections/item/page-section.component.scss
@@ -1,16 +1 @@
 
-.section {
-  margin-top: 24px;
-  display: flex;  
-  flex-direction: column;
-}
-
-@media screen and (max-width: 768px) {
-  .section {
-    .content {
-      images-section {
-        width: 100%;
-      }
-    }
-  }
-}
diff --git a/src/app/_modules/pages/sections/types/basic/images/images-section.component.html b/src/app/_modules/pages/sections/types/basic/images/images-section.component.html
index 45c5489..85da0ba 100644
--- a/src/app/_modules/pages/sections/types/basic/images/images-section.component.html
+++ b/src/app/_modules/pages/sections/types/basic/images/images-section.component.html
@@ -1,7 +1,7 @@
 <div *ngIf="items?.length">
 
   <div *ngIf="imageType!=='carousel'&&!(imageType=='large-preview'&&items.length==1)" 
-  class="items" [ngClass]="imageClass">  
+  class="items" [ngClass]="imageType">  
     <div class="item" *ngFor="let item of items; let i = index">
       <img [src]="item.links?.full" (click)="show(i)"/>
     </div>
diff --git a/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss b/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
index c1903cf..e69de29 100644
--- a/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
+++ b/src/app/_modules/pages/sections/types/basic/images/images-section.component.scss
@@ -1,213 +0,0 @@
-.mobile{
-  display: none;
-}
-.desctop{
-  display: flex;
-}
-.close{
-  position: absolute;
-  top:24px;
-  right: 24px;
-}
-
-
-
-.items {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  width: 100%;
-  gap: 8px;
-
-  img{  
-    border: 1px solid var(--second-dis);
-  }
-
-  &.small{
-    .item{
-      margin-bottom: 16px;
-      img{
-        max-height: 273px;
-        max-width: 273px; 
-      }
-    }      
-  }
-
-  &.large{
-    display: flex;
-    flex-direction: column;
-
-    .item{
-      max-width: 100%;
-      margin-bottom: 32px;
-      img{
-        max-height: 468px;
-        max-width: 100%;
-      }
-    }      
-  }
-
-  .item {
-    
-    position: relative;
-
-    img {
-      cursor: pointer;
-    }
-
-    &:last-child {
-      margin-bottom: 0;
-    }
-
-    &.full-width {
-      display: flex;
-      flex-direction: column;
-      img {
-        width: 100%;
-        height: auto;
-      }
-    }
-  }
-}
-
-.carousel {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content:center;
-  gap: 24px;
-  .prev, .next {
-    cursor: pointer;
-    z-index: 1;
-    &.prev{
-      left:0;
-    }
-    &.next{
-      right:0;
-    }
-  }
-  .center {
-    width: 600px;
-
-  }
-}
-
-.slide {
-  width: 600px;
-  height: 450px;
-
-  display: block;
-  img {
-    object-fit: cover;
-    width: 100%;
-    height: 100%;
-  }
-}
-
-.fullscreen {
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 2;
-  position: fixed;
-  align-items: center;
-  justify-content: center;
-  background-color: rgba(37, 46, 52, 60%);
- 
-  .content {
-    position: fixed;
-    display: flex;
-    pointer-events: none;
-    
-    
-    width: calc(100vw - 2 * 24px);
-    height: calc(100vh - 2 * 24px);
-    left: 24px;
-    right: 24px;
-    *{
-      pointer-events:all;
-    }
-    img {
-      object-fit: contain;
-      width: 100%;
-  height: 100%;
-    }
-
-    .left {
-      width: 72px;
-      flex-grow: 0;
-      display: flex;
-      cursor: pointer;
-      align-items: center;
-      justify-content: center;
-    }
-    .right {
-      width: 72px;
-      flex-grow: 0;
-      display: flex;
-      cursor: pointer;
-      align-items: center;
-      justify-content: center;
-    }
-  }
-  .between{
-    justify-content:space-between;
-  }
-  .center{
-    justify-content:center;
-  }
-  .bottom{
-    align-items: flex-end;
-    gap: 8px;
-    .thumbnails{
-      position: static;
-      display: block;
-      width: 72px;
-      height: 52px;
-      border: 2px solid var(--prime);
-
-      img{
-        width: 100%;
-        height: 100%;
-        object-fit:cover;
-      };
-    };
-
-  }
-
-}
-
-@media screen and (max-width: 480px) {
-  .desctop{
-    display: none !important;
-  }
-  .mobile{
-    display: flex !important;
-  }
-  .fullscreen {
-
-   
-    .content {
-      position: fixed;
-      display: flex;
-      pointer-events: none;
-      
-      
-      width:100vw;
-      height:100vh;
-      left: 0;
-      right: 0;
-    }
-    .prev{
-      z-index: 5;
-      margin-right: -50px;
-    }
-    .next{
-      z-index: 5;
-      margin-left: -50px;
-    }
-  }
-}
-
-
diff --git a/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts b/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts
index cb07c34..c510388 100644
--- a/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts
+++ b/src/app/_modules/pages/sections/types/basic/images/images-section.component.ts
@@ -46,13 +46,7 @@ export class ImagesSectionComponent {
     let type = this.objectsService.getValue(this.section, 'image-type');
     return type.name;
   }
-  get imageClass(){
-    return {
-      small : this.imageType=='tiles',
-      large : this.imageType=='full-width',
-      carousel: this.imageType=='carousel'
-    }
-  }
+
   set photo(activePhoto: string) {
     this.activePhoto = activePhoto
   }
diff --git a/src/assets/css/_pages-section.scss b/src/assets/css/_pages-section.scss
index d54b882..57db1f7 100644
--- a/src/assets/css/_pages-section.scss
+++ b/src/assets/css/_pages-section.scss
@@ -1,3 +1,12 @@
+pages-section{
+  .section {
+    margin-top: 24px;
+    display: flex;  
+    flex-direction: column;
+  }
+}
+
+
 add-section{
     .add{
         position: relative;
@@ -42,4 +51,247 @@ cards-section-items{
           }
         }
     }
+}
+
+images-section{
+  display: block;
+
+  .mobile{
+    display: none;
+  }
+  .desctop{
+    display: flex;
+  }
+  .close{
+    position: absolute;
+    top:24px;
+    right: 24px;
+  }
+  
+  
+  
+  .items {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    width: 100%;
+    gap: 8px;
+  
+    img{  
+      border: 1px solid var(--second-dis);
+    }
+  
+    &.tiles{
+      .item{
+        margin-bottom: 16px;
+        img{
+          max-height: 273px;
+          max-width: 273px; 
+        }
+      }      
+    }
+  
+    &.full-width{
+      display: flex;
+      flex-direction: column;
+  
+      .item{
+        max-width: 100%;
+        margin-bottom: 32px;
+        img{
+          max-height: 468px;
+          max-width: 100%;
+        }
+      }      
+    }
+  
+    .item {
+      
+      position: relative;
+  
+      img {
+        cursor: pointer;
+      }
+  
+      &:last-child {
+        margin-bottom: 0;
+      }
+  
+      &.full-width {
+        display: flex;
+        flex-direction: column;
+        img {
+          width: 100%;
+          height: auto;
+        }
+      }
+    }
+  }
+  
+  .carousel {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content:center;
+    gap: 24px;
+    .prev, .next {
+      cursor: pointer;
+      z-index: 1;
+      &.prev{
+        left:0;
+      }
+      &.next{
+        right:0;
+      }
+    }
+    .center {
+      width: 600px;
+    }
+  }
+  
+  .slide {
+    width: 600px;
+    height: 450px;
+  
+    display: block;
+    img {
+      object-fit: cover;
+      width: 100%;
+      height: 100%;
+    }
+  }
+  
+  .fullscreen {
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 2;
+    position: fixed;
+    align-items: center;
+    justify-content: center;
+    background-color: rgba(37, 46, 52, 60%);
+   
+    .content {
+      position: fixed;
+      display: flex;
+      pointer-events: none;
+      
+      
+      width: calc(100vw - 2 * 24px);
+      height: calc(100vh - 2 * 24px);
+      left: 24px;
+      right: 24px;
+      *{
+        pointer-events:all;
+      }
+      img {
+        object-fit: contain;
+        width: 100%;
+    height: 100%;
+      }
+  
+      .left {
+        width: 72px;
+        flex-grow: 0;
+        display: flex;
+        cursor: pointer;
+        align-items: center;
+        justify-content: center;
+      }
+      .right {
+        width: 72px;
+        flex-grow: 0;
+        display: flex;
+        cursor: pointer;
+        align-items: center;
+        justify-content: center;
+      }
+    }
+    .between{
+      justify-content:space-between;
+    }
+    .center{
+      justify-content:center;
+    }
+    .bottom{
+      align-items: flex-end;
+      gap: 8px;
+      .thumbnails{
+        position: static;
+        display: block;
+        width: 72px;
+        height: 52px;
+        border: 2px solid var(--prime);
+  
+        img{
+          width: 100%;
+          height: 100%;
+          object-fit:cover;
+        };
+      };
+  
+    }
+  
+  }
+  
+  @media screen and (max-width: 700px){
+    .carousel {
+  
+      .prev, .next {
+        cursor: pointer;
+        z-index: 1;
+        position: absolute;
+        &.prev{
+          left: 36px;
+          z-index: 2;
+        }
+        &.next{
+          right: 36px;
+        }
+      }
+      .center {
+        width: 100%;
+        .slide {
+          width: calc( 100vw - 80px );
+          height: calc( (100vw - 80px) * 0.75 );
+  
+          img {
+  
+          }
+        }
+      }
+    }
+  }
+  @media screen and (max-width: 480px) {
+    .desctop{
+      display: none !important;
+    }
+    .mobile{
+      display: flex !important;
+    }
+    .fullscreen {
+  
+     
+      .content {
+        position: fixed;
+        display: flex;
+        pointer-events: none;
+        
+        
+        width:100vw;
+        height:100vh;
+        left: 0;
+        right: 0;
+      }
+      .prev{
+        z-index: 5;
+        margin-right: -50px;
+      }
+      .next{
+        z-index: 5;
+        margin-left: -50px;
+      }
+    }
+  }
 }
\ No newline at end of file
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
deleted file mode 100644
index 0759e96..0000000
--- a/src/environments/environment.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-// This file can be replaced during build by using the `fileReplacements` array.
-// `ng build` replaces `environment.ts` with `environment.prod.ts`.
-// The list of file replacements can be found in `angular.json`.
-
-export const environment = {
-  production: false,
-  apiUrl: 'http://api.nircms.lc',
-  clientId: 2,
-  clientSecret: 'X3UeoxxgzZTmBKRMlU1SESlDsAShzctArHucncE4',
-  project: null,
-  defaultLocale: 'ru'
-};
-
-
-/*
- * For easier debugging in development mode, you can import the following file
- * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
- *
- * This import should be commented out in production mode because it will have a negative impact
- * on performance if an error is thrown.
- */
-// import 'zone.js/plugins/zone-error';  // Included with Angular CLI.