Invie/index.html at master · mauriterry/Invie · 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
<!DOCTYPE html>
<html>
  <head>
    <title>Invie - tus mejores guitarras!!</title>
    <meta charset="utf-8"/>
    <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Allerta' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/invie.css"/>
    <!-- <link rel="stylesheet" media="(max-width: 800px)" href="css/media-querie.css"/> -->
  </head>
  <body>
    <section id="portada" class="portada background"> <!-- portada -->
      <header id="header" class="header contenedor"> <!-- header -->
        <figure class="logotipo"> <!-- logotipo -->
          <img src="images/invie.png" width="186" height="60" alt="Invie logotipo"/>
        </figure>
        <nav class="menu"> <!-- menu -->
          <ul>
            <li>
              <a href="index.html">Home</a>
            </li>
            <li>
              <a href="#guitarras">Guitarras</a>
            </li>
            <li>
              <a href="precios.html">Precios</a>
            </li>
          </ul>
        </nav>
      </header>
      <div class="contenedor">
        <h1 class="titulo">Guitarras <span>invie</span>sibles</h1><!-- titulo -->
        <h3 class="title-a">Sé la estrella de rock que siempre quisiste ser</h3><!-- resumen -->
        <a class="button" href="#guitarras">Conoce mas</a><!-- boton -->
      </div>
    </section>
    <section id="guitarras" class="guitarras contenedor"> <!-- guitarras -->
      <h2>Nuestra guitarras</h2><!-- titulo -->
      <article class="guitarra"> <!-- guitarra 1 -->
        <img class="derecha" src="images/invie-acustica.png" alt="Guitarra Invie Acustica" width="350"/>
        <div class="contenedor-guitarra-a">
          <h3 class="title-b">Invie Acustica</h3>
          <ol>
            <li>Estilo vintage</li>
            <li>Madera pura</li>
            <li>Incluye estuche invisible de aluminio</li>
          </ol>
        </div>
      </article>
      <article class="guitarra b"> <!-- guitarra 2 -->
        <img class="izquierda" src="images/invie-classic.png" alt="Guitarra Invie Classic" width="350"/>
        <div class="contenedor-guitarra-b">
          <h3 class="title-b">Invie Classic</h3>
          <ol>
            <li>Estilo vintage</li>
            <li>Liviana</li>
            <li>Inicia tu camino como Rockstar</li>
          </ol>
        </div>
      </article>
    </section>
    <footer class="footer">
      <div class="contenedor">
        <div class="contacto">
          <img src="images/invie-white.png" alt="logotipo blanco"/>
          <a href="tel:+573024456678"><strong>Telefono</strong> <span>3024456678</span></a>
          <a href="mailto:contacto@invie.com"><strong>E-mail</strong> <span>contacto@invie.com</span></a>
        </div>
        <form class="formulario">
          <div class="col1">
            <label for="nombre">Nombre</label>
            <input type="text" required id="nombre" name="nombre"/>
            <label for="email">E-mail</label>
            <input type="email" required id="email" name="email"/>
            <div class="sexo">
              <label for="mujer">
                <input type="radio" id="mujer" checked name="sexo" value="mujer"> mujer
              </label>
              <label for="hombre">
                <input type="radio" id="hombre" name="sexo" value="hombre"> hombre
              </label>
            </div>
            <div class="intereses">
              <label for="cotizacion">
                <input type="checkbox" checked id="cotizacion" name="intereses" value="cotizacion"> Cotización
              </label>
              <label for="reclamos">
                <input type="checkbox" id="reclamos" name="intereses" value="reclamos"> Reclamos
              </label>
              <label for="comentarios">
                <input type="checkbox" id="comentarios" name="intereses" value="comantarios"> Comentarios
              </label>
              <label for="otros">
                <input type="checkbox" id="otros" name="intereses" value="otros"> Otros
              </label>
            </div>
          </div>
          <div class="col2">
            <label for="comentarios">Comentarios</label>
            <textarea name="comantarios" id="comentarios" cols="30" rows="7"></textarea>
            <input type="submit" value="Enviar" class="button"/>
          </div>
        </form>
      </div>
    </footer>
  </body>
</html>