Tweak layout break to view PV in mobile device

Author: yasulab

app/assets/stylesheets/custom.scss

@@ -3,6 +3,22 @@
 
 // Customized by YassLab
 
+.home-point-video {
+	position: relative;
+	margin-bottom: 30px;
+	padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
+	padding-top: 25px;
+}
+
+.home-point-video iframe {
+	position: absolute;
+	top:  0;
+	left: 3.5%;
+	width:  95% !important;
+	height: 100% !important;
+}
+
+
 .cursor-default{
   cursor: default !important;
 }

app/views/custom_widget/show.html.erb

@@ -30,8 +30,9 @@
       <li><a href="http://berd.benesse.jp/special/manabi/manabi_10.php">「自由」というルールを共有し、プログラミングの学習機会を提供する</a>  (まなびのかたち)</li>
       <li><a href="http://ict-enews.net/zoomin/17coderdojo/">子どものための無料プログラミング道場 CoderDojo をはじめてみませんか</a> (ICT教育ニュース)</li>
     </ul>
-    
-    <iframe width="560" height="315" src="https://www.youtube.com/embed/gLDue2xb1j8?rel=0" frameborder="0" allowfullscreen></iframe>
+    <div class="home-point-video">
+      <iframe width="560" height="315" src="https://www.youtube.com/embed/gLDue2xb1j8?rel=0" frameborder="0" allowfullscreen></iframe>
+    </div>
   <p><a href='http://www.coderdojo-kashiwa.com/'>CoderDojo Kashiwa</a> が制作した動画です。<br />道場の雰囲気が伝われば幸いです ;)</p>
 
   <ol style="list-style: none; margin-top: 30px;">