.vpconfigs-settings-con{
  display: flex;
  >.dzs-tabs{
    flex: 1;
  }
}

.preview-player-iframe-con {


  position: relative;




  height: 150px;
  top: 50px;

  background-color: #5a5959;
  opacity: 0.9;
  flex: 0 0 400px;

  border: 1px solid rgba(50, 50, 50, 0.5);

  $transition-property: width, height, opacity, transform;
  $transition-duration: 0.3s;
  $transition-timing: ease-out;

  @include apply_transition($transition-property, $transition-duration, $transition-timing);


  &:hover {


    opacity: 1;
    width: 800px;
    height: 200px;

    .preview-player-iframe {

      transform: scale(1);
    }

  }


  .preview-player-iframe {

    position: absolute;
    top: 0;
    height: 300px;
    width: 800px;

    width: 200%;
    height: 200%;
    flex: 0 0 300px;
    object-fit: cover;
    transform: scale(0.5);
    right: 0;
    transform-origin: top right;
    pointer-events: none;
    $transition-property: width, height, opacity, transform;
    $transition-duration: 0.3s;
    $transition-timing: ease-out;

    &.preview-iframe-hidden{
      opacity: 0;
    }

    @include apply_transition($transition-property, $transition-duration, $transition-timing);
  }

  .btn-refresh-preview {
    position: absolute;
    top: 10px;
    right: 10px;
  }
}