@-webkit-keyframes litebox-loader-rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes litebox-loader-rotate {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@-webkit-keyframes litebox-fade-in {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes litebox-fade-in {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@-webkit-keyframes litebox-fade-out {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

@keyframes litebox-fade-out {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

@-webkit-keyframes litebox-slide-up {
  from {
    -webkit-transform: translateY(30px);
            transform: translateY(30px); }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0); } }

@keyframes litebox-slide-up {
  from {
    -webkit-transform: translateY(30px);
            transform: translateY(30px); }
  to {
    -webkit-transform: translateY(0);
            transform: translateY(0); } }

@-webkit-keyframes litebox-slide-down {
  from {
    -webkit-transform: translateY(0);
            transform: translateY(0); }
  to {
    -webkit-transform: translateY(30px);
            transform: translateY(30px); } }

@keyframes litebox-slide-down {
  from {
    -webkit-transform: translateY(0);
            transform: translateY(0); }
  to {
    -webkit-transform: translateY(30px);
            transform: translateY(30px); } }

@-webkit-keyframes litebox-slide-to-right {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(30px);
            transform: translateX(30px); } }

@keyframes litebox-slide-to-right {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(30px);
            transform: translateX(30px); } }

@-webkit-keyframes litebox-slide-to-left {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(-30px);
            transform: translateX(-30px); } }

@keyframes litebox-slide-to-left {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0); }
  to {
    -webkit-transform: translateX(-30px);
            transform: translateX(-30px); } }

@-webkit-keyframes litebox-slide-from-right {
  from {
    -webkit-transform: translateX(30px);
            transform: translateX(30px); }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@keyframes litebox-slide-from-right {
  from {
    -webkit-transform: translateX(30px);
            transform: translateX(30px); }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@-webkit-keyframes litebox-slide-from-left {
  from {
    -webkit-transform: translateX(-30px);
            transform: translateX(-30px); }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

@keyframes litebox-slide-from-left {
  from {
    -webkit-transform: translateX(-30px);
            transform: translateX(-30px); }
  to {
    -webkit-transform: translateX(0);
            transform: translateX(0); } }

.litebox.is-animated.before-load {
  -webkit-animation: litebox-fade-in .5s ease-out forwards;
          animation: litebox-fade-in .5s ease-out forwards; }
  .litebox.is-animated.before-load .litebox-wrapper {
    -webkit-animation: litebox-slide-up .5s ease-out forwards;
            animation: litebox-slide-up .5s ease-out forwards; }

.litebox.is-animated.before-unload {
  -webkit-animation: litebox-fade-out .5s ease-out forwards;
          animation: litebox-fade-out .5s ease-out forwards; }
  .litebox.is-animated.before-unload .litebox-wrapper {
    -webkit-animation: litebox-slide-down .5s ease-out forwards;
            animation: litebox-slide-down .5s ease-out forwards; }

.litebox.is-animated.before-next .litebox-wrapper {
  -webkit-animation: litebox-slide-to-left .5s ease-out forwards, litebox-fade-out .5s ease-out forwards;
          animation: litebox-slide-to-left .5s ease-out forwards, litebox-fade-out .5s ease-out forwards; }

.litebox.is-animated.after-next .litebox-wrapper {
  -webkit-animation: litebox-slide-from-right .5s ease-out, litebox-fade-in .5s ease-out;
          animation: litebox-slide-from-right .5s ease-out, litebox-fade-in .5s ease-out; }

.litebox.is-animated.before-prev .litebox-wrapper {
  -webkit-animation: litebox-slide-to-right .5s ease-out forwards, litebox-fade-out .5s ease-out forwards;
          animation: litebox-slide-to-right .5s ease-out forwards, litebox-fade-out .5s ease-out forwards; }

.litebox.is-animated.after-prev .litebox-wrapper {
  -webkit-animation: litebox-slide-from-left .5s ease-out, litebox-fade-in .5s ease-out;
          animation: litebox-slide-from-left .5s ease-out, litebox-fade-in .5s ease-out; }

.litebox {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(45, 45, 50, 0.9); 
  z-index: 9999;
}

.litebox-wrapper {
  position: relative;
  min-width: 20rem;
  min-height: 10rem; }
  @media screen and (min-width: 40rem) {
    .litebox-wrapper {
      max-width: 92vw;
      max-height: 92vh; } }
  @media screen and (max-width: 40rem) {
    .litebox-wrapper {
      max-width: 100vw;
      max-height: 100vh; } }

.litebox-image-wrapper {
  margin: 0; }

.litebox-image {
  vertical-align: middle;
  box-shadow: 0 2rem 4rem rgba(0, 0, 0, 0.3); }
  @media screen and (min-width: 40rem) {
    .litebox-image {
      max-width: 92vw;
      max-height: 92vh; } }
  @media screen and (max-width: 40rem) {
    .litebox-image {
      max-width: 100vw;
      max-height: 100vh; } }
  .litebox-image.is-hidden {
    display: none; }

.litebox-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1rem 1.5rem;
  box-sizing: border-box;
  line-height: 1.5;
  color: white;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 0; }
  .litebox-caption.is-hidden {
    display: none; }

.litebox-button {
  padding: 0;
  margin: 0;
  position: absolute;
  width: 3rem;
  height: 3rem;
  border: none;
  color: white;
  background-color: rgba(0, 0, 0, 0.4);
  background-position: center center;
  background-repeat: no-repeat;
  text-indent: -9999px;
  z-index: 9999;
  cursor: pointer;
  outline: none;
  border-radius: 0;
  transition: background-color .1s linear; }
  .litebox-button.is-hidden {
    display: none; }
  .litebox-button:hover, .litebox-button:focus {
    background-color: rgba(0, 0, 0, 0.7); }

.litebox-button-close {
  top: 0;
  right: 0;
  background-image: url("../icons/close.svg"); }

.litebox-button-next {
  right: 0;
  top: calc(50% - 1.5rem);
  background-image: url("../icons/arrow-next.svg"); }

.litebox-button-prev {
  left: 0;
  top: calc(50% - 1.5rem);
  background-image: url("../icons/arrow-prev.svg"); }

.litebox-error {
  text-align: center;
  position: absolute;
  width: 100%;
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  color: white; }
  .litebox-error.is-hidden {
    display: none; }

.litebox-loader {
  position: absolute;
  top: calc(50% - 1.5rem);
  left: calc(50% - 1.5rem);
  width: 3rem;
  height: 3rem;
  background-color: rgba(0, 0, 0, 0.4);
  border-radius: 0; }
  .litebox-loader.is-hidden {
    display: none; }
  .litebox-loader::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 70%;
    height: 70%;
    border-radius: 50%;
    left: 12.5%;
    top: 12.5%;
    box-sizing: border-box;
    border: 2px solid transparent;
    border-top-color: white;
    -webkit-animation: litebox-loader-rotate 1s linear infinite;
            animation: litebox-loader-rotate 1s linear infinite; }