.image__wrapper {
 position: relative;
 display: flex;
 flex-flow: row wrap;
 justify-content: space-between;
 align-items: center;
 height: 100%;
 width: 100%;
 margin: 0 auto;
}
.image__wrapper img {
 width: 39%;
 height: 100vh;
 max-height: 560px;
 object-fit: cover;
 margin-bottom: 10px;
 transition: 0.5s linear;
 cursor: pointer;
}
.image__wrapper img:nth-child(4n),
.image__wrapper img:nth-child(4n + 1) {
 width: 60%;
}
/* картинка на странице */
.minimized {
 cursor: pointer;
}
/* увеличенная картинка */
#magnify {
 display: none;
 position: fixed;
 z-index: 9999;
}
#magnify img {
 width: 100%;
 object-fit: contain;
 box-shadow: 0 0 0 4px #fff, 0 0 2px 2px #000;
}
/* затемняющий фон */
#overlay {
 display: none;
 background: #000;
 position: fixed;
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 opacity: 0.5;
 z-index: 9990;
}
/* кнопка закрытия */
#close-popup {
 width: 30px;
 height: 30px;
 background: rgba(255, 255, 255, 0.4);
 border-radius: 15px;
 cursor: pointer;
 position: absolute;
 top: 15px;
 right: 15px;
}
#close-popup i {
 width: 30px;
 height: 30px;
 background: url(../img/cross.png) no-repeat center center;
 background-size: 16px 16px;
 display: block;
}
#magnify {
 position: fixed;
 max-width: 95vw;
 max-height: 95vh;
 z-index: 10001;
 background: white;
 border-radius: 8px;
 overflow: hidden;
 box-shadow: 0 0 30px rgba(0, 0, 0, 0.3);
 display: flex;
 align-items: center;
 justify-content: center;
}

#image-container {
 width: 100%;
 height: 100%;
 display: flex;
 align-items: center;
 justify-content: center;
 cursor: grab;
}

#image-container:active {
 cursor: grabbing;
}

#magnify img {
 max-width: 100%;
 max-height: 100%;
 width: auto;
 height: auto;
 object-fit: contain;
}

#overlay {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background: rgba(0, 0, 0, 0.8);
 z-index: 10000;
}
@keyframes rota {
 25% {
  transform: rotate(360deg);
 }
}
#close-popup:hover {
 cursor: pointer;
}
@media (max-width: 991px) {
 #magnify img {
  height: 100%;
  object-fit: cover;
 }
}
.slider_swipe {
 display: none;
}
@media (max-width: 776px) {
 .slider_swipe {
  display: block !important;
  position: relative;
  margin: 30px auto;
 }
 .slick-list,
 .slider_swipe {
  overflow: hidden;
 }
 .slick-track {
  display: flex;
  align-items: flex-start;
 }
 .image__wrapper {
  display: none;
 }
 .image__wrapper img {
  width: auto;
  max-height: 300px;
  object-fit: cover;
  margin-right: 10px;
 }
 .bd {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
 }
}
@media (max-width: 475px) {
 #magnify {
  width: 95vw;
  height: auto;
 }
}