Mobile view for embedded videos

Site URL: https://www.jjflax.com/things/animations

Hi. 

I have a page dedicated to short animations on my website. I embedded all of the animations from YouTube so that they automatically play, but in a mobile view this leaves them all awkwardly cropped. Is there a way to inset them only for mobile, and delete the embedded version for mobile as well? Or does anyone have an alternate solution/idea? Thank you! 

Edit page > Add Code Block > Paste this code

<style>
  @media screen and (max-width:767px) {
  #page section:first-child {
    min-height: unset !important;
    height: 30vh;
}
  }
</style>