Methods for controlling the scaling of video in a theme using Foundation.

foundation-grid-sized-flex-video.html

<div class="row"><!-- not really need - row should exist higher in the doc -->
  <div class="six columns centered"><!-- six is the width (half) but could be one through tweleve - centered centers it -->
    <div class="flex-video widescreen"><!-- widescreen is for the 560 315 ratio -->
      <iframe width="560" height="315" src="http://www.youtube.com/embed/N966cATFWjI" frameborder="0" allowfullscreen=""></iframe>
    </div>
  </div>
</div>

foundation.flex-video.css

/* Stop over scaling */

.flex-video iframe, .flex-video object, .flex-video embed, .flex-video video {
  max-width: 420px;
  max-height: 315px;
}
.flex-video.widescreen iframe, .flex-video.widescreen object, .flex-video.widescreen embed, .flex-video.widescreen video{
  max-width: 560px;
}
.flex-video.widescreen.vimeo iframe, .flex-video.widescreen object.vimeo, .flex-video.widescreen.vimeo embed, .flex-video.widescreen.vimeo video {
  max-width: 400px;
  max-height: 225px;
}