.container {
  display: grid;
  grid-template-columns: 42vw calc(58vw - 40px);
  /*grid-template-rows: calc((100dvh - 61px)/2);*/
  grid-template-rows: calc((100dvh - 121px)/2);
  grid-gap: 6px;
  margin-top: 7px;
  margin-left: 7px;
  margin-right: 7px;
  height: calc(100vh - 120px);
  overflow-y: auto;
}


.about {
  padding: 5px;
  padding-left: 15px;
}



.left {
  height:calc(((100dvh - 126px)/2) - 2px);
  width: calc(42vw - 4px);
  position: fixed;
  align-self: start;
  z-index: 1;
}


.lTop {
  background-color: black;
  top: 60px;
  grid-row: 1/2;
}


.lBottom {
  background-color: black;
  top: calc((100dvh + 7px)/2);
  grid-row: 2/3;
}


.fill1 {
    grid-column: 1/2;
    grid-row: 3/12; /*second number needs to be (total slideShowContainers-2) *2 */
    z-index: 0;
}


.right {
  grid-row: span 2;
  grid-column-start: 2;
  max-height: calc(100dvh - 120px); /*-61*/
  min-height: calc(100dvh - 120px);
/*  margin-bottom: 65px;*/
}

.previewPage {
  position: relative;
  left: 30%;
  background-color: #ff07075c;
  box-shadow: inset 0 2px 12px #ffffff;
  border-radius: 12px;
  color: whitesmoke;
  font-size: 35px;
  bottom: 20%;
  padding: 15px;
}


.preview:hover {
  background-color: #ff070775;
}


@media (min-width: 1250px) {
  .videoWrapperLimit {
    max-width: 42vw !important;
  }
}

@media (max-width: 1250px) {
  .previewPage {
    left: initial;
  }
  .example {
    top: initial;
    left: initial;
    transform: initial;
  }
  .right {
    min-height: initial;
  }
}