From 2f3f0688f3aca7082871f3baae7db398ba2a5198 Mon Sep 17 00:00:00 2001
From: Naren Akash R J <43748290+narenakash@users.noreply.github.com>
Date: Sun, 31 Mar 2019 12:34:47 +0530
Subject: [PATCH 1/5] Responsiveness for iframes Created

The youtube videos in iframes are now responsive.
---
 src/lab/exp2/Theory.html | 25 ++++++++++++++++++++++---
 1 file changed, 22 insertions(+), 3 deletions(-)
diff --git a/src/lab/exp2/Theory.html b/src/lab/exp2/Theory.html
index 7a5a172..87b104a 100644
--- a/src/lab/exp2/Theory.html
+++ b/src/lab/exp2/Theory.html
@@ -25,6 +25,21 @@
     <link href="../../../css/style.css" rel="stylesheet">
 	<script type="text/javascript" src = 'tabs.js'></script>
 <script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-67558473-1', 'auto');ga('send', 'pageview');</script>	
+<style>
+	.videoWrapper {
+	position: relative;
+	padding-bottom: 56.25%; 
+	padding-top: 25px;
+	height: 0;
+	}
+	.videoWrapper iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	}
+</style>
 </head>
 <body id="page-top" class="index">
 <div id="top">
@@ -100,13 +115,17 @@ <h2 class="text-h2-lightblue" style=" margin-bottom: 20px; margin-top: 10px; "><
 							<!--edit -->
 <h1 class="text-h2-lightblue">Carry out Fly Leveling using Auto Level</h1><div class="content" id="experiment-article-section-1-content">
 <h2>Explanation in Class Room through Video Coverage </h2>
-<p><iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/oHk_onMDxCM" width="640"></iframe></p>
-<h2> </h2>
+<p>
+<div class="videoWrapper">
+	<iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/oHk_onMDxCM" width="640"></iframe></p>
+</div> <h2> </h2>
 <h2>Principle</h2>
 <p>Simple addition and subtraction is used to determine the elevations of various points</p>
 <h2> </h2>
 <h2>Methodology</h2>
-<iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/Bm8CB-SeL4U" width="640"></iframe>
+<div class="videoWrapper">
+	<iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/Bm8CB-SeL4U" width="640"></iframe>
+</div>
 <p><br clear="all">
 </br></p>
 </div>						</div>

From e1076836e779443d3c317e93af4c1fcaf920ed0a Mon Sep 17 00:00:00 2001
From: Naren Akash R J <43748290+narenakash@users.noreply.github.com>
Date: Sun, 31 Mar 2019 12:42:03 +0530
Subject: [PATCH 2/5] Responsiveness for Videos Created

Responsiveness for Youtube videos in iframes is created.
---
 src/lab/exp3/Theory.html | 21 +++++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/lab/exp3/Theory.html b/src/lab/exp3/Theory.html
index 9a4a227..869ee55 100644
--- a/src/lab/exp3/Theory.html
+++ b/src/lab/exp3/Theory.html
@@ -25,6 +25,21 @@
     <link href="../../../css/style.css" rel="stylesheet">
 	<script type="text/javascript" src = 'tabs.js'></script>
 <script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-67558473-1', 'auto');ga('send', 'pageview');</script>	
+<style>
+	.videoWrapper {
+	position: relative;
+	padding-bottom: 56.25%; /* 16:9 */
+	padding-top: 25px;
+	height: 0;
+}
+.videoWrapper iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+</style>
 </head>
 <body id="page-top" class="index">
 <div id="top">
@@ -100,14 +115,16 @@ <h2 class="text-h2-lightblue" style=" margin-bottom: 20px; margin-top: 10px; "><
 							<!--edit -->
 <h1 class="text-h2-lightblue">Carry out Profile Leveling using Auto Level</h1><div class="content" id="experiment-article-section-1-content">
 <h2>Explanation in Class Room through Video Coverage </h2>
+<div class="videoWrapper">
 <p><iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/EIJUFgdZKQU" width="640"></iframe></p>
-<h2> </h2>
+</div> <h2> </h2>
 <h2>Principle</h2>
 <p>Simple addition and subtraction is used to determine the elevations of various points</p>
 <h2> </h2>
 <h2>Methodology</h2>
+<div class="videoWrapper">
 <iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/m2aAn-Vt2S0" width="640"></iframe>
-<p><br clear="all">
+</div><p><br clear="all">
 </br></p>
 </div>						</div>
 					</div>

From f560319a9f79b93a23a3ad70f43ce9a539fa38bf Mon Sep 17 00:00:00 2001
From: Naren Akash R J <43748290+narenakash@users.noreply.github.com>
Date: Sun, 31 Mar 2019 12:50:29 +0530
Subject: [PATCH 3/5] Responsiveness for videos on iframe created

---
 src/lab/exp4/Theory.html | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/lab/exp4/Theory.html b/src/lab/exp4/Theory.html
index 6c3768e..5e99269 100644
--- a/src/lab/exp4/Theory.html
+++ b/src/lab/exp4/Theory.html
@@ -25,6 +25,21 @@
     <link href="../../../css/style.css" rel="stylesheet">
 	<script type="text/javascript" src = 'tabs.js'></script>
 <script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-67558473-1', 'auto');ga('send', 'pageview');</script>	
+<style>
+	.videoWrapper {
+	position: relative;
+	padding-bottom: 56.25%; /* 16:9 */
+	padding-top: 25px;
+	height: 0;
+}
+.videoWrapper iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+</style>
 </head>
 <body id="page-top" class="index">
 <div id="top">
@@ -100,7 +115,9 @@ <h2 class="text-h2-lightblue" style=" margin-bottom: 20px; margin-top: 10px; "><
 							<!--edit -->
 <h1 class="text-h2-lightblue">Observations of Vertical and Horizontal angles using Total Station</h1><div class="content" id="experiment-article-section-1-content">
 <h2>Explanation in Class Room through Video Coverage </h2>
+<div class="videoWrapper">							
 <p><iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/4NVCbdQPdTQ" width="640"></iframe></p>
+</div>
 <h2> </h2>
 <h2>Principle</h2>
 <p>It is based on the measurement of time for the distance travelled by wave<br>
@@ -114,7 +131,9 @@ <h2>Principle</h2>
 <p>  </p>
 <h2> </h2>
 <h2>Methodology</h2>
+<div class="videoWrapper">
 <iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/edfkXHrxfDw" width="640"></iframe>
+</div>
 <p><br clear="all">
 </br></p>
 </div>						</div>

From ff49548c3cb2618d16293f5a4fb4c76b451de6bd Mon Sep 17 00:00:00 2001
From: Naren Akash R J <43748290+narenakash@users.noreply.github.com>
Date: Sun, 31 Mar 2019 12:59:26 +0530
Subject: [PATCH 4/5] Video Responsiveness Created

---
 src/lab/exp5/Theory.html | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/lab/exp5/Theory.html b/src/lab/exp5/Theory.html
index 2ef72ce..ef350e9 100644
--- a/src/lab/exp5/Theory.html
+++ b/src/lab/exp5/Theory.html
@@ -25,6 +25,21 @@
     <link href="../../../css/style.css" rel="stylesheet">
 	<script type="text/javascript" src = 'tabs.js'></script>
 <script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-67558473-1', 'auto');ga('send', 'pageview');</script>	
+<style>
+	.videoWrapper {
+	position: relative;
+	padding-bottom: 56.25%; /* 16:9 */
+	padding-top: 25px;
+	height: 0;
+	}
+	.videoWrapper iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	}
+</style>
 </head>
 <body id="page-top" class="index">
 <div id="top">
@@ -100,14 +115,18 @@ <h2 class="text-h2-lightblue" style=" margin-bottom: 20px; margin-top: 10px; "><
 							<!--edit -->
 <h1 class="text-h2-lightblue">Study of Plane Table and Its Accesories</h1><div class="content" id="experiment-article-section-1-content">
 <h2>Explanation in Class Room through Video Coverage </h2>
+<div class="videoWrapper">
 <p><iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/azPyAkC2nIg" width="640"></iframe></p>
+</div>
 <h2> </h2>
 <h2>Principle</h2>
 <p>Plane Tabling is a graphical method where measurements are carry out plot the details for preparing the map of the area.</p>
 <p>  </p>
 <h2> </h2>
 <h2>Methodology</h2>
+<div class="videoWrapper">
 <iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/iARMptRwFfM" width="640"></iframe>
+</div>
 <p><br clear="all">
 </br></p>
 </div>						</div>

From 1d0867dd1713676eea1ab44c39a698b7115e1f8e Mon Sep 17 00:00:00 2001
From: Naren Akash R J <43748290+narenakash@users.noreply.github.com>
Date: Sun, 31 Mar 2019 13:07:16 +0530
Subject: [PATCH 5/5] Responsiveness for Frames Created

---
 src/lab/exp6/Theory.html | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/lab/exp6/Theory.html b/src/lab/exp6/Theory.html
index 9ad73c9..097ee5f 100644
--- a/src/lab/exp6/Theory.html
+++ b/src/lab/exp6/Theory.html
@@ -25,6 +25,21 @@
     <link href="../../../css/style.css" rel="stylesheet">
 	<script type="text/javascript" src = 'tabs.js'></script>
 <script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)})(window,document,'script','//www.google-analytics.com/analytics.js','ga');ga('create', 'UA-67558473-1', 'auto');ga('send', 'pageview');</script>	
+<style>
+.videoWrapper {
+	position: relative;
+	padding-bottom: 56.25%; /* 16:9 */
+	padding-top: 25px;
+	height: 0;
+}
+.videoWrapper iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
+</style>	
 </head>
 <body id="page-top" class="index">
 <div id="top">
@@ -100,7 +115,9 @@ <h2 class="text-h2-lightblue" style=" margin-bottom: 20px; margin-top: 10px; "><
 							<!--edit -->
 <h1 class="text-h2-lightblue">Detail Plotting by Radiation method</h1><div class="content" id="experiment-article-section-1-content">
 <h2>Explanation in Class Room through Video Coverage </h2>
+<div class="videoWrapper">
 <iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/jDlXdr2sFwY" width="640"></iframe>
+</div>
 <h2> </h2>
 <h2>Principle</h2>
 <ul>
@@ -111,7 +128,9 @@ <h2>Principle</h2>
 <p>  </p>
 <h2> </h2>
 <h2>Methodology</h2>
+<div class="videoWrapper">
 <iframe allowfullscreen frameborder="0" height="390" src="https://www.youtube.com/embed/IGSGLyjA1w8" width="640"></iframe>
+</div>
 <p><br clear="all">
 </br></p>
 </div>						</div>
