.litbx {
  /*
		Arrow
	 */
  /*
		Loading
	 */
}
.litbx__overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8);
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.litbx__wrapper {
  position: relative;
  box-sizing: content-box;
  /*
		height: 90%;
		width: 40%;
		*/
  background-color: #fff;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.litbx__inner {
  width: 100%;
  height: 100%;
}
.litbx__inner img {
  width: 100%;
  height: 100%;
}
.litbx__item {
  /*
		height: 90%;
		width: auto;
		*/
}
.litbx__arrow {
  position: absolute;
  cursor: pointer;
  width: 30%;
  top: 0;
  bottom: 0;
  background-color: rgba(200, 200, 200, 0.1);
  color:#fff;
}
.litbx__arrow i {
  position: absolute;
  top: 50%;
  background-color: green;
  padding: 10px 20px;
}
.litbx__arrow i.prev {
  left: 0;
}
.litbx__arrow i.next {
  right: 0;
}
.litbx__arrow--prev {
  left: 0;
}
.litbx__arrow--next {
  right: 0;
}
.litbx__overlay.loading::after {
  content: "";
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 101;
  width: 40px;
  height: 40px;
  background-color: yellow;
  -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
          animation: sk-rotateplane 1.2s infinite ease-in-out;
}
@-webkit-keyframes sk-rotateplane {
  0% {
    -webkit-transform: perspective(120px);
  }
  50% {
    -webkit-transform: perspective(120px) rotateY(180deg);
  }
  100% {
    -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);
  }
}
@keyframes sk-rotateplane {
  0% {
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
            transform: perspective(120px) rotateX(0deg) rotateY(0deg);
  }
  50% {
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
            transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
  }
  100% {
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
  }
}
