html,body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
}

.main-container {
    scroll-snap-type: x mandatory;
    scroll-snap-type: y mandatory;
}

.text {
    opacity: 1.0
    z-index: 0
}

.bg { 
  /* Center and scale the image nicely */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  overflow: hidden;
  scroll-snap-align: start;
}

.main-content {
  color: #ffffff;
}

.vert-center {
  padding-top: 20%;
  padding-bottom: 20%;
}

.container {
    margin-right: 0px;
    margin-left: 0px;
}

.video-container{
  width: 100vw;
  height: 100vh;
  position: fixed;
  z-index: -99;
}
    
iframe {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100vw;
  height: 100vh;
  transform: translate(-50%, -50%);
}

@media (min-aspect-ratio: 16/9) {
  .video-container iframe {
    /* height = 100 * (9 / 16) = 56.25 */
    height: 56.25vw;
  }
}
    
@media (max-aspect-ratio: 16/9) {
  .video-container iframe {
    /* width = 100 / (9 / 16) = 177.777777 */
    width: 177.78vh;
  }
}

.vid-text{
  position: absolute;
  color: #FFFFFF;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}