sailormoon/index.html at master · andreazomoza/sailormoon · 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
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<!DOCTYPE html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <title>Andrea Zomoza - Sailor Moon Web</title>
    <link rel="icon" type="image/svg" href="img/moonicon.svg"/>
    <link href="https://fonts.googleapis.com/css?family=Fjalla+One|Source+Sans+Pro" rel="stylesheet">
    <link rel="stylesheet" href="styles.css">
    <meta name="viewport" content="width=device-width, initial-scale=1">
  </head>
  <body>
    <header class="header">
      <div class="container">
        <figure class="logo" background="red">
          <img src="img/LOGOHEAD.jpg" height="70px" alt="imagen" />
        </figure>
        <nav class="menu">
          <ol>
            <li>
              <a class="link" href="index.html">Home</a>
            </li>
            <li>
              <a class="link" href="personajes/moon.html">Moon</a>
            </li>
            <li>
              <a class="link" href="personajes/mars.html">Mars</a>
            </li>
            <li>
              <a class="link" href="personajes/mercury.html">Mercury</a>
            </li>
            <li>
              <a class="link" href="personajes/jupiter.html">Jupiter</a>
            </li>
            <li>
              <a class="link" href="../personajes/venus.html">Venus</a>
            </li>
            <li>
              <a class="link" href="#contacto">Contacto</a>
            </li>
          </ol>
        </nav>
      </div>
    </header>
    <section class="hero">
      <div class="container">
        <h1>
          Somos las <strong>Sailor Scout</strong>
          <br> Que luchan por el amor y la justicia, <br>En el nombre de la <strong>LUNA</strong>
        </h1>

        <img class="hero-image" src="img/sailorscout.jpg" width="500" height="300" alt="imagen principal del sitio">
      </div>

    </section>

    <section id="portafolio" class="portfolio">
      <div class="container">

      <article class="project">
        <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1175387.0304315153!2d139.11344587727356!3d35.53940822627123!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x605d1b87f02e57e7%3A0x2e01618b22571b89!2zVG9raW8sIEphcMOzbg!5e0!3m2!1ses-419!2sar!4v1601527902045!5m2!1ses-419!2sar" width="600" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>

        <div class="project-details">
          <h3 class="project-title">  DONDE PUEDES ENCONTRARNOS?</h3>
          <h6 class="project-course"> TOKIO JAPON</h6>
          <img src="IMG/LOGOJAPAN.png">
        </div>

      </article>

      </div>

    </section>
    <div class="container">
      <h2 class="event-list-title">Mis Transformaciones</h2>
    </div>
    <section id="eventos" class="event-list">
      <div class="container">
        <article class="event">
          <iframe width="560" height="315" src="https://www.youtube.com/embed/Zq8_XppDXdk" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
        </article>
        <article class="event">

          <iframe width="560" height="315" src="https://www.youtube.com/embed/pcw4kQVG6CM" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
        </article>
      </div>
    </section>
    <section id="contacto" class="contact">
      <div class="container">
        <form action="/suscripcion/" class="form-email">
          <h3>Newsletter Sailor Moon Fans Club</h3>
          <input type="text" placeholder="Déjame tu email" id="email">
          <button>Enviar</button>
        </form>
        <div class="social">
          <a href="https://twitter.com/" class="social-link twitter"></a>
          <a href="https://facebook.com/" class="social-link facebook"></a>
          <a href="https://github.com/" class="social-link github"></a>
          <a href="https://instagram.com/" class="social-link instagram"></a>
        </div>
      </div>
    </section>
    <footer class="footer">
      <div class="container">
        <div>
          <p>Sailor Moon <img src="img/moonicon.svg" width="50" alt="logo"></p>
        </div>
        <div>
          <p>
            Designed by Andrea Zomoza - Trabajo Practico codo a codo</a>
          </p>
        </div>
      </div>
    </footer>
  </body>
</html>