div.float_modal {
  display: none;
  position: fixed;
  z-index: 9999;
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  inset: 0;
}
span.float_modal_close {
 position: absolute;
 top: 20px;
 right: 20px;
 color: #F40000;
 font-size: 40px;
 font-weight: bold;
 transition: 0.3s;
 cursor: pointer;
 z-index: 2;
}
div.float_modal_content {
  background-color: #fefefe;
  padding: 20px;
  border: 1px solid #888;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(94vw, 1100px);
  height: min(94vh, 750px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
#video_modal_cont {
  flex: 1 1 auto;
  min-height: 0;             /* IMPORTANT for flex children that must shrink */
  width: 100%;
  height: auto;              /* let flex drive the height */
}
#video_modal_cont iframe,
#video_modal_cont video {
  width: 100%;
  height: 100%;
  display: block;
}

@media screen and (max-width:479px) {
div.float_modal {
 top: 123px;  /* need buffer to push next div below menu */
}
}
@media screen and (min-width:480px) {
div.float_modal {
 top: 164px;  /* need buffer to push next div below menu */
}
}