/*============================================================================================
	Start Stroy Area
==============================================================================================*/

.story-wrapper {
  background-image: url("../images/about/story-frame.png");
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 55px;
  position: relative;
}
.story-image {
  width: 100%;
}
.story-lightbox {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media only screen and (min-width: 768px) and (max-width: 1199.99px) {
  .story-wrapper {
    padding: 32px;
  }
  .story-lightbox-img {
    width: 80px;
    height: 80px;
  }
}

@media only screen and (max-width: 767.99px) {
  .story-wrapper {
    padding: 14px;
  }
  .story-lightbox-img {
    width: 60px;
    height: 60px;
  }
}

/*============================================================================================
	End Stroy Area
==============================================================================================*/