#header_section {
  background-color: #fff;
}

.banner:hover .gallery-image-1 {
  right: 16.6% !important;
}
.banner:hover .gallery-image-2 {
  left: 53% !important;
}
.banner:hover .gallery-image-3 {
  right: 10% !important;
  top: 47% !important;
}
.banner:hover .gallery-image-4 {
  bottom: 18% !important;
}
.banner:hover .gallery-image-5 {
  right: 35% !important;
  bottom: 27% !important;
}
.banner:hover .gallery-image-6 {
  right: 30% !important;
  top: 38% !important;
}
.banner:hover .gallery-image-7 {
  right: 17% !important;
  top: 28% !important;
}
.banner:hover .gallery-image-8 {
  bottom: 30% !important;
}
.banner:hover .gallery-image-9 {
  top: 32% !important;
}
.banner:hover .gallery-image-10 {
  bottom: 21% !important;
}
.banner:hover .gallery-image-11 {
  left: 12% !important;
}
.banner:hover .gallery-image-12 {
  left: 10% !important;
  bottom: 25% !important;
}
.banner:hover .gallery-image-13 {
  left: 4% !important;
}
.banner:hover .gallery-image-14 {
  top: 42% !important;
  left: 18% !important;
}
.banner:hover .gallery-image-15 {
  top: 25% !important;
  left: 12% !important;
}

#banner_section {
  background-color: #20343c;
  padding: 0 150px;
}
#banner_section .banner {
  height: 100vh;
}
#banner_section .banner .banner-contents-col {
  padding-right: 60px;
}
#banner_section .banner .banner-contents-col .banner-contents {
  position: initial;
}
#banner_section .banner .banner-contents-col .banner-contents h1 {
  opacity: 1;
}
#banner_section .banner .banner-contents-image {
  height: 100vh;
}
#banner_section .banner .banner-contents-image img {
  width: auto;
  height: auto;
}
#banner_section .banner .banner-contents-image .gallery-image-1 {
  position: absolute;
  bottom: 18%;
  right: 0;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-2 {
  position: absolute;
  bottom: 18%;
  left: 40%;
  transition: 1s;
  z-index: 2;
}
#banner_section .banner .banner-contents-image .gallery-image-3 {
  position: absolute;
  top: 40%;
  right: -13%;
  transition: 1s;
  z-index: 2;
}
#banner_section .banner .banner-contents-image .gallery-image-4 {
  position: absolute;
  bottom: 5%;
  left: 63%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-5 {
  position: absolute;
  bottom: 29%;
  right: 29%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-6 {
  position: absolute;
  top: 32%;
  right: 16%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-7 {
  position: absolute;
  top: 16%;
  right: 15%;
  transition: 1s;
  z-index: 2;
}
#banner_section .banner .banner-contents-image .gallery-image-8 {
  position: absolute;
  bottom: 35%;
  left: 33%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-9 {
  position: absolute;
  top: 27%;
  left: 24%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-10 {
  position: absolute;
  bottom: 17%;
  left: 25%;
  transition: 1s;
  z-index: 2;
}
#banner_section .banner .banner-contents-image .gallery-image-11 {
  position: absolute;
  bottom: 36%;
  left: 18%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-12 {
  position: absolute;
  bottom: 20%;
  left: 6%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-13 {
  position: absolute;
  bottom: 31%;
  left: 0%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-14 {
  position: absolute;
  top: 36%;
  left: -1%;
  transition: 1s;
}
#banner_section .banner .banner-contents-image .gallery-image-15 {
  position: absolute;
  top: 18%;
  left: 6%;
  transition: 1s;
}

#after_before_section .after-before-title h3 {
  font-size: 34px;
}
#after_before_section .after-before-title h3 span {
  font-family: "Poppins-Bold";
}
#after_before_section .screenshot_slider .owl-nav {
  text-align: center;
}
#after_before_section .screenshot_slider .owl-nav button {
  font-size: 22px !important;
  margin: 20px 10px 0;
  color: #000000 !important;
  border: 1px solid #000;
  padding: 0px 10px !important;
  transition: 0.3s;
}
#after_before_section .screenshot_slider .owl-nav button:hover {
  color: #ffffff !important;
  background-color: #000;
}
#after_before_section .screenshot_slider.owl-carousel .owl-item {
  transform: scale(0.9);
}
#after_before_section .screenshot_slider .owl-item.active.center {
  transform: scale(1);
}
#after_before_section .owl-carousel .owl-item img {
  -o-object-fit: cover;
     object-fit: cover;
}

.comparison-slider-wrapper {
  position: relative;
  width: 100%;
}

.comparison-slider-wrapper .comparison-slider {
  position: relative;
  width: 100%;
}

.comparison-slider-wrapper .comparison-slider > img {
  width: 100%;
  height: auto;
  display: block;
}

.comparison-slider-wrapper .comparison-slider .resize {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 50%;
  overflow: hidden;
}

.comparison-slider-wrapper .comparison-slider .resize > img {
  display: block;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.cd-handle {
  position: absolute;
  height: 44px;
  width: 44px;
  left: 50%;
  top: 50%;
  margin-left: -22px;
  margin-top: -22px;
  border-radius: 50%;
  background: #000000 url(/images/cd-arrows.svg?da2fde1488fab347be37079234dec048) no-repeat center center;
  cursor: move;
  box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.2), 0 0 10px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.3);
  opacity: 0;
  transform: translate3d(0, 0, 0) scale(0);
}

.cd-handle.draggable {
  /* change background color when element is active */
  background-color: #445b7c;
}

.is-visible .cd-handle {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
  transition: transform 0.3s 0.7s, opacity 0s 0.7s;
}

#gallery_image_grid_section .gallery-image-title {
  text-align: center;
  margin-bottom: 30px;
}
#gallery_image_grid_section .gallery-image-title h3 {
  font-family: "Poppins-Bold";
  font-size: 34px;
}
#gallery_image_grid_section .gallery-images {
  /* Grids --------------------------------------------*/
  /* Grid images --------------------------------------------*/
}
#gallery_image_grid_section .gallery-images .container {
  display: grid;
  grid-gap: 1rem;
  grid-template-columns: repeat(3, 1fr);
  margin: 0 auto;
  max-width: 98%;
  padding: 3rem 0;
}
#gallery_image_grid_section .gallery-images .img {
  border-radius: 0;
  height: 500px;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

@media only screen and (max-width: 991px) {
  #gallery_image_grid_section .gallery-images .container {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (max-width: 767px) {
  #gallery_image_grid_section .gallery-images .img {
    height: 250px;
  }
  #gallery_image_grid_section .gallery-images .container {
    padding-top: 0;
  }
  #gallery_image_grid_section .gallery-image-title h3 {
    font-size: 21px;
  }
  #after_before_section .after-before-title h3 {
    font-size: 21px;
  }
  .banner-contents-image {
    display: none;
  }
  #banner_section .banner {
    height: 300px;
  }
  #banner_section .banner .banner-contents-col .banner-contents {
    position: absolute;
  }
}