p#lightbox--openbutton
{
  display: table;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  margin-bottom: 0px !important;
  background: radial-gradient(closest-side,rgba(0,0,0,.345), rgba(0,0,0,0));
  opacity: 0;
  transition: all 250ms ease-in-out;
  text-align: center;
}

section#meerinformatie-content > article > span:hover p#lightbox--openbutton
{
  opacity: 1;
}

div#meerinformatie-content-photo-flex > div:hover p#lightbox--openbutton
{
  opacity: 1;
}

p#lightbox--openbutton > span
{
  display: table-cell;
  height: 100%;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  font-size: 40px;
  color: white;
}

div#lightbox
{
  display: table;
  position: fixed;
  top: 75px;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(100vh - 75px);
  width: 100%;
  z-index: 25;
  opacity: 0;
  transition: all 250ms ease-in-out;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none;
}

div#lightbox.visible
{
  opacity: 1;
  user-select: initial;
  pointer-events: initial;
}

div#lightbox--inner
{
  display: table-cell;
  height: 100%;
  width: 100%;
  text-align: center;
  vertical-align: middle;
  position: relative;
  background-color: rgba(0,0,0,.75);
}

div#lightbox div#lightbox--inner img
{
  transform: scale(.5);
  max-height: 80vh;
  max-width: calc(100% - 20px);
  transition: all 250ms ease-in-out;
}

div#lightbox.visible div#lightbox--inner img
{
  transform: scale(1);
}

p#lightbox--inner--closebutton
{
  display: table;
  position: absolute;
  cursor: pointer;
  top: 75px;
  right: 75px;
  padding: 15px;
  background: white;
  cursor: pointer;
  opacity: .55;
  transition: all 250ms ease-in-out;
  border-radius: 50%;
  z-index: 28;
}

p#lightbox--inner--closebutton:hover
{
  opacity: 1;
}

p#lightbox--inner--closebutton > span
{
  display: table-cell;
  height: 100%;
  width: 100%;
  font-size: 20px;
  text-align: center;
  vertical-align: middle;
}