workshop/index.html at master · amarazzi/workshop · 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
116
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="css/reset.css">
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700|Open+Sans:400,700" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
	<title></title>
</head>
<body>

	<div>
		<a href="#arrow"><span class="flecha ion-chevron-up"></span></a>
	</div>

	<nav>
		<div class="contenedor">
		<h4>Nombre apellido</h4>
		<ul>
			<li><a href="#portfolio">Portfolio</a></li>
			<li><a href="#about">About</a></li>
			<li><a href="#contact">Contact</a></li>
		</ul>
		</div>
	</nav>

	<header>
		<div class="contenedor">
			<div class="name">
				<img src="images/me.png"/>
				<h1>Nombre apellido</h1>
				<span class="estrella1"><span class="ion-star"></span></span>
				<p>Frontend developer</p>
			</div>
		</div>
	</header>

	<section class="portfolio_uno">
		<div class="contenedor">
			<h2>Portfolio</h2>
			<span class="estrella2"><span class="ion-star"></span></span>
			<ul class="portfolio_dos">
				<li><a class="hvr-sweep-to-top" href="#"><img src="images/5.png"></a></li>
				<li><a class="hvr-sweep-to-top" href="#"><img src="images/2.png"></a></li>
				<li><a class="hvr-sweep-to-top" href="#"><img src="images/6.png"></a></li>
				<li class="romper"><a class="hvr-sweep-to-top" href="#"><img src="images/3.png"></a></li>
				<li><a class="hvr-sweep-to-top" href="#"><img src="images/4.png"></a></li>
				<li><a class="hvr-sweep-to-top" href="#"><img src="images/1.png"></a></li>
			</ul>
		</div>
	</section>

	<section class="about">
		<div class="contenedor">
			<h2>About</h2>
			<span class="estrella1"><span class="ion-star"></span></span>
			<article>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
				tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
				quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
				consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
				cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
				proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
				tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
				quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
				consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
				cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
				proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
			</article>
		</div>
	</section>

	<section class="contacto">
		<div class="contenedor">
			<h2>Contact me</h2>
			<span class="estrella2"><span class="ion-star"></span></span>
			<form method="post" action="enviar.php">
				<input type="text" name="nombre" placeholder="Name" required>
				<input type="email" name="mail" placeholder="E-Mail Adress" required="">
				<input type="tel" name="telefono" placeholder="Phone Number">
				<input class="message" type="text" name="message" placeholder="Message">
				<button class="boton_uno">Send</button>
			</form>
		</div>
	</section>

	<footer>
		<div class="contenedor">
			<div class="footer3">
				<h3>Location</h3>
				<p>3481 Melrose Place</p>
				<p>Beverly Hills, CA 90210</p>
			</div>

			<div class="footer2">
				<nav>
					<h3>Around the web</h3>
					<ul>
						<li><a href=""><span class="ion-social-facebook"></span></a></li>
						<li><a href=""><span class="ion-social-googleplus"></span></a></li>
						<li><a href=""><span class="ion-social-twitter"></span></a></li>
						<li><a href=""><span class="ion-social-linkedin"></span></a></li>
						<li><a href=""><span class="ion-social-dribbble-outline"></span></a></li>
					</ul>
				</nav>
			</div>
		</div>
		<div class="copyright">
				<p>Copyright © Your Website 2016</p>
		</div>
	</footer>
</body>
</html>