/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/



#page2 {
  height: 100vh;
  width: 100%;
  /* padding-top: 15vh; */
  /* position: relative; */
  background-color: #151515;
  margin-top: 21vh;
  margin-bottom: -21vh;
}

#video-container {
  height: 76vh;
  width: 71vw;
  position: relative;
  left: 29%;
  background-image: url(https://obys.agency/wp-content/uploads/2022/11/Showreel-2022-preview-1.jpg);
  background-size: cover;
  background-position: center;
}

#video-container img {
  position: absolute;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  top: 0;
}

#video-container video {
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  opacity: 0;
}

#video-cursor {
  background-color: #ffa63d;
  height: 10.5vw;
  width: 10.5vw;
  border-radius: 50%;
  position: absolute;
  z-index: 999;
  top: -10%;
  left: 70%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

#video-cursor i {
  font-size: 2vw;
}





/* RESPONSIVE */

@media(max-width:600px){
  

#page2 {
height: 50vh;
width: 100%;
/* padding-top: 15vh; */
/* position: relative; */
background-color: #151515;
margin-top: 6vh;
/* background-color: orange; */

}

#video-container {
height: 90%;
width:100% ;
position: relative;
left: 0;
background-image: url(https://obys.agency/wp-content/uploads/2022/11/Showreel-2022-preview-1.jpg);
background-size: cover;
background-position: center;
/* background: red; */

}

#video-container img {
position: absolute;
height: 100%;
width: 100%;
-o-object-fit: cover;
   object-fit: cover;
top: 0;
}

#video-container video {
height: 100%;
width: 100%;
-o-object-fit: cover;
   object-fit: cover;
opacity: 0;
}

#video-cursor {
background-color: #ffa63d;
height: 25.5vw;
width: 25.5vw;
border-radius: 50%;
position: absolute;
z-index: 999;
top: 50%;
left: 50%;
/* right: 50%; */
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
-webkit-box-pack: center;
    -ms-flex-pack: center;
        justify-content: center;
}

#video-cursor i {
font-size: 5vw;
}

}