.videoModule {width: 100%; position: relative; min-height: 468px;}
.videoModule .moduleBg {position: absolute; height: 100%; width: 100%; object-fit:cover; z-index: 0;}
.videoModule .overlay {
  position: absolute;
  width: 100%; height: 100%; z-index: 1;
  background: rgb(0,0,0);
background: linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,.25) 50%, rgba(0,0,0,0.4) 100%);
}
.videoPopup { display:flex; min-height: 400px; padding: 0 10px; gap: 20px; margin: 0 auto; position: relative; z-index: 3; align-items:center;}
.videoPopup.flip {flex-direction: row-reverse;}
.videoPopup > div {flex:1; position: relative; display: flex;}
.videoPopup .thumbnail {position:relative; width: auto; height: 100%;}
.videoPopup .thumbnail-pic {height: 100%; width: 100%; object-fit: contain; max-height: 300px;}
.videoPopup .thumbnail-pic > img {box-shadow: 0 0 20px rgba(0 0 0 / 40%);}
.videoPopup .text {display: flex; align-items: center; padding: 10px;}

.video-btn img {opacity: .7; transition: all .2s ease-in-out; filter: drop-shadow(0px 0px 0px rgba(0,0,0,0));}
.video-btn img:hover {opacity: .8; filter: drop-shadow(0px 0px 25px rgba(0,0,0,.4));}
.video-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  cursor: pointer;
}

.video-btn a {
    font-size: 15px;
    position: relative;
    top: 25px;
    right: 5px;
    color: #043381;
}

.video-btn a span {
  position: absolute;
  border-left: 12px solid #000fff;
  border-top: 8px solid #fff;
  border-bottom: 8px solid #fff;
}


#close {
  position: absolute;;
  top: -60px;
  right: 0px;
  padding: 10px;
  background: transparent;
  border: 0;
  cursor: pointer;
  z-index: 5;
  
}
#close img {width: 35px; height: 35px; opacity: .8;}

.modal-container {
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0;
  pointer-events: none;
  position: fixed;
 inset: 0;
  transition: opacity 300ms ease-in;
  
  z-index: 999999999;
}

.modal-container.show-modal {
  display: block;
  z-index: 100;
  pointer-events: auto;
  opacity: 1;
}

.modal {
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  position: absolute;
  top: 53%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 800px;
 
  max-width: 100%;
 
}
.modal .inner{
    position: relative;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
}
#videoIframe {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}

iframe (max-width: 100%!important;}

@media (max-width: 860px){
  .videoPopup {flex-direction: column-reverse;} 
}