.lg-backdrop {
  opacity: 0.8 !important;
}
.lg-prev::after,
.lg-next::before {
  content: none !important;
}

.lg-content {
  width: 80% !important;
  height: 80% !important;
  margin-left: auto;
  margin-right: auto;

  @media (max-width: 435px) {
    height: 400px !important;
    top: 50% !important;
    transform: translate(0, -50%) !important;
  }
}

.lg-prev,
.lg-next {
  opacity: 0.8 !important;
  border: solid 1px !important;
  padding: 30px 34px !important;
  background-color: rgba(0, 0, 0, 0.1) !important;
  top: auto !important;
  bottom: 0 !important;

  @media (max-width: 435px) {
    padding: 20px 24px !important;
  }
}

.lg-prev {
  left: 50% !important;
  transform: translate(-100%, 120%) !important;
  @media (max-width: 1440px) {
    transform: translate(-100%, 100%) !important;
  }
  @media (max-width: 880px) {
    transform: translate(-100%, -190%) !important;
  }
  @media (max-width: 435px) {
    transform: translate(-100%, 0) !important;
  }
}

.lg-next {
  right: 50% !important;
  transform: translate(100%, 120%) !important;
  @media (max-width: 1440px) {
    transform: translate(100%, 100%) !important;
  }
  @media (max-width: 880px) {
    transform: translate(100%, -190%) !important;
  }
  @media (max-width: 435px) {
    transform: translate(100%, 0) !important;
  }
}

.lg-toolbar {
  width: 80% !important;
  transform: translate(14%, 100%) !important;

  @media (max-width: 1300px) {
    top: 50% !important;
    transform: translate(15%, -950%) !important;
  }
  @media (max-width: 1200px) {
    top: 50% !important;
    transform: translate(15%, -850%) !important;
  }
  @media (max-width: 880px) {
    top: 50% !important;
    transform: translate(15%, -750%) !important;
  }
  @media (max-width: 435px) {
    top: 50% !important;
    transform: translate(15%, -350%) !important;
  }
}

@media (max-width: 435px) {
}