body { 
width: 100vw; 
height: 100vh; 
margin: 0; 
}

#gradient{
    top:0;
    left:0;
    position: absolute;
    background:linear-gradient(to right,rgba(65, 0, 255, 0.4),rgba(255, 0, 232, 0.3));
    z-index: 0;
width: 100vw; 
height: 100vh; 
    pointer-events: none;
}

#myVideo { 
object-fit: cover; 
width: 100%; 
height: 100%; 
z-index: -99999;
}

.btncont {
object-fit: cover; 

}

svg#play {
    margin: 0; 
    position: absolute;
    top: 0;
    left: 35%;
    width:30%;
    height:100%;
    display:block;
    cursor: pointer;
    transform-origin: 50% 50%;
}

svg#play #triangle {
  fill:rgba(22,22,22,0);
  transition:500ms;
  transform-origin: 50% 50%;
  z-index: 999;
}

svg#play:hover #triangle {
  fill:#c89beb;
  transform-origin: 50% 50%;
  stroke: #c89beb;
}

svg #lineOne, svg #lineTwo {
  transform-origin: 50% 50%;
  transition: 1s;
} 

 svg:hover #lineOne {
  transform: rotate(260deg);
   -webkit-transform: rotate(260deg);
-moz-transform: rotate(260deg);
-o-transform: rotate(260deg);
   transform-origin: 50% 50%;
   stroke: #bc55d4;
}

 svg:hover #lineTwo {
  transform: rotate(-450deg);
   transform-origin: 50% 50%;
    stroke: #bc55d4;
}
