/* modal window */

.modal-window {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 100; /* Sit on top */
  /*padding-top: 60px; /* Location of the box */
  left: 0%;
  top: 0%;
    width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
    animation: 0.3s ease 0s 1 normal none running fadeIn;
}

/* Modal Content */
#contentWindow {
    margin: auto;
    width: 90%;
    padding:0em;
    display: block;
}

#contentWindow.video {
    position: relative;
    width: 95vw;
    display:flex;
    align-content: center;
    justify-content: center;
    -webkit-box-pack:center;
}

#content {
    position:absolute;
    width:90%;
    height:90%;
    top: 50%;
    left: 50%;
  transform: translate(-50%, -50%);
}

#contentWindow.video #content { top:0; left:0; width:100%; height:100%; transform: none; background:transparent !important;}
.lightbox-video-wrapper { padding-bottom:50%; margin-top:1rem}

.lightbox-btn-close { position:absolute; top:4%; right:4.5%;background-size:50%; z-index:101; width:2.2em; height:2.2em; border-radius:50%; transition:all .3s; border:none; background:url("../../images/core/lightbox/icon-lightbox-close.svg") center no-repeat #333 50%; cursor: pointer;}

.lightbox-btn-close::before {
    content:'Close activity';
    left:0px;
    display:none;
    color:var(--text-light);
    font-family: var(--font-paragraph);
    font-size:var(--fs-3);
    top:-0.5rem;
    padding:0.8rem;
    position: absolute;
    background-color:#333;
    border-radius:var(--border-radius-default);
    transition:left 100ms linear;
}
.lightbox-btn-close:hover::before {
    left:-150px;
    display: block;
}

.video .lightbox-btn-close { top:3%; right:8%;}

@media all and (-webkit-min-device-pixel-ratio: 2){
  .lightbox-btn-close{
    width: 3rem;
    height: 3rem;
  }
}

@media all and (min-width: 1540px) {
    .lightbox-btn-close {
        right:13.5%;
    }
}

@media all and (min-height: 880px) {
    .lightbox-btn-close {
        top:6%;
    }
}

.close:hover,
.close:focus {
  color: #ccc;
  text-decoration: underline;
  cursor: pointer;
}