From dd5506eeb79af537238d1edd6068a4e941d1c06f Mon Sep 17 00:00:00 2001
From: Valera Rozuvan <valera@edx.org>
Date: Thu, 29 Aug 2013 13:55:18 +0300
Subject: [PATCH] Adding styles to fix issue BLD-221.

If you make the window smaller, and keep reducing it's size, at some
point the controls will not fit, and some will be bumped to the next row.
When the widnow is resized below the width 1024, extra styling rules
will kick in to fix this issue. The word "Speed" from the speeds control
will be temporarirly hidden.
---
 .../xmodule/xmodule/css/video/display.scss    | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/common/lib/xmodule/xmodule/css/video/display.scss b/common/lib/xmodule/xmodule/css/video/display.scss
index dc801be0f9..74f5d22b76 100644
--- a/common/lib/xmodule/xmodule/css/video/display.scss
+++ b/common/lib/xmodule/xmodule/css/video/display.scss
@@ -225,6 +225,19 @@ div.video {
             @include transition(none);
             -webkit-font-smoothing: antialiased;
             width: 116px;
+
+            @media (max-width: 1024px) {
+              width: 86px;
+            }
+
+            h3 {
+              display: block;
+
+              @media (max-width: 1024px) {
+                display: none;
+              }
+            }
+
             outline: 0;
 
             &:focus {
@@ -247,6 +260,11 @@ div.video {
               font-weight: bold;
               margin-bottom: 0;
               padding: 0 lh(.5) 0 0;
+
+              @media (max-width: 1024px) {
+                padding: 0 lh(.5) 0 lh(.5);
+              }
+
               line-height: 46px;
               color: #fff;
             }
@@ -268,6 +286,11 @@ div.video {
             opacity: 0.0;
             position: absolute;
             width: 131px;
+
+            @media (max-width: 1024px) {
+              width: 101px;
+            }
+
             z-index: 10;
 
             li {