Fluid Video

An embedded HTML5 video that scales appropriately according to screen size. Will also fallback safely to a linked image for clients that don't support embedded video.

	/* Fluid Video Media Pattern CSS */
   @media only screen and (max-width: 599px) {
       div[class="pattern"] video,
       div[class="pattern"] img
           width: 100%;
           height: auto !important;

<div class="pattern">
  <video style="padding: 0px; margin: 0px; display: block;" poster="" controls="controls" height="337" width="600">
      <source src=";codecs=h264&amp;clip_id=52861634&amp;time=1361256207&amp;sig=21d65c6cd03979983f6efa864c746c06&amp;type=html5_desktop_local" type="video/mp4"></source>
      <source type="video/ogg" src=""></source>
      <source type="video/webm" src=""></source>

      <a href=""><img style="display: block;" border="0" src="connecting-fallback.jpg" width="600" height="337" label="Fallback Image" /></a>