YogNMe/instructionLearn5.html at main · Arpitsing/YogNMe · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" type="image/png" sizes="32x32" href="imgs/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="imgs/favicon-16x16.png">
    <title>Instructions</title>
    <link rel="stylesheet" href="style.css">
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-178448067-1"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', 'UA-178448067-1');
    </script>
</head>
<body>
  <img src="imgs/blob3.svg" style="position:absolute; width: 600px; height: 600px; left: -210px; top: -300px;">
  <h1 style="font-size: 100px; top:-30px">Warrior-I Pose</h1>


  <!-- <div><img src="imgs/blob.svg" style="position:absolute; width: 130px; height: 130px; top: 250px;"></div>
  <div><img src="imgs/blob1.svg" style="position:absolute; width: 130px; height: 130px; top: 250px; left:500px"></div>
  <div><img src="imgs/blob2.svg" style="position:absolute; width: 130px; height: 130px; top: 250px; left:970px"></div> -->


  <!-- <div><h3 style="width: 60px; height: 60px; position:absolute; top: 245px; ">1.</h3></div>
  <div><h3 style="width: 60px; height: 60px; position:absolute; top: 245px; left:500px">2.</h3></div>
  <div><h3 style="width: 60px; height: 60px; position:absolute; top: 245px; left:970px">3.</h3></div> -->


<!-- <div class="buttons">
  <div><p style="width: 290px; position:absolute; top: 400px;"">Accept camera access and wait for the webcam to load.</p></div>
  <div><p style="width: 290px; position:absolute; top: 400px; left:550px"">Perform the same pose as the image on the right, making sure to face the same direction.</p></div>
  <div><p style="width: 290px; position:absolute; top: 400px; left: 1020px"">Hold for 10 seconds. <br>The timer will restart if you make a mistake. Make sure to complete all six poses. Enjoy!</p></div>
  <div><h3></h3></div>
</div> --> -->
<!--
<img src="imgs/allow.png" style="position:absolute; top: 560px; left: 260px; height:90px"/>
<img src="imgs/mountain.svg" style="position:absolute; top: 387px; left: 760px; height:250px"/>
<img src="imgs/time.svg" style="position:absolute; top: 370px; left: 1290px; height:100px"/> -->


<!-- <center>
  <iframe width="720" height="420"
    src="https://www.youtube.com/embed/xDY2ayzTUuU?autoplay=1&mute=1">
  </iframe>
</center> -->

<div class="responsive-video">

  <iframe class="video"
     src="https://www.youtube.com/embed/kkGY3xBnaGc?autoplay=1&mute=1" frameborder="0">
  </iframe>
  <div class = "description">
    <h4><i>
        Warrior 1 Pose is a standing yoga pose that helps build focus, power and stability.
        This foundational pose stretches the front side of the body and is great for building
        strength in the legs, core and back.
    </i></h4>
  </div>
</div>

<div class="buttons">
  <div><a href="instructionLearnHome.html" style="width: 150px"><indexbutton style="font-size: 40px; top:700px">Back</indexbutton></a></div>
  <div></div>

  </div>
</body>
</html>