#lightbox {
  background: #000;
  position: fixed;
  display: flex;
  justify-content: space-between;
  align-items: center;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: -1;
  transition: .2s all;
}

#screen {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow-y: hidden;
  width: 100%;
  height: 100vh;
}

/*.arrow-container{
               display: block;
               position: fixed;
            }
                  .arrow{
                     cursor: pointer;
                     font-size: 2em;
                     color: white;
                  }
                  #left-arrow{

                  }
                  #right-arrow{

                  }*/
#preloader {
  position: fixed;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-top: 5px solid rgba(251, 219, 27, 0.86);
  animation: spin 1s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}

#lightbox-image {
  /*flex-basis: 75vw;*/
  max-height: 90%;
  max-width: 90%;
  opacity: 0;
  transition: .2s all;
}

.lightbox-display {
  opacity: 1 !important;
  z-index: 99 !important;
  transition: .2s all;
}