-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
188 lines (184 loc) · 9.72 KB
/
index.html
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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://kit.fontawesome.com/0e93438c39.js" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<title>Portafolio Jeff</title>
</head>
<body>
<header>
<div class="logo">
<img src="./imagenes/logo.png" alt="logo Jeff" />
</div>
<nav>
<ul>
<li><a href="#acerca">ACERCA DE</a></li>
<li><a href="#proyectos">PROYECTOS</a></li>
<li><a href="#habilidades">HABILIDADES</a></li>
<li><a href="#contacto">CONTACTO</a></li>
</ul>
</nav>
</header>
<main>
<div>
<div id="acerca">
<div class="row text-center">
<div class="col-md-8">
<h1>¡Hola! Soy Jeff</h1>
<p>Licenciado en acompañamiento canino graduado con honores, experto en actividades al aire
libre y apasionado del pollo. Me considero un excelente compañero de aventuras, siempre fiel
y dispuesto a ir a donde sea, ya sea en medio del bosque o a lado de ti disfrutando una
buena película. </p>
<div class="general-button">
<div class="btn-wrap">
<a href="./imagenes/dormidolengua.jpg">Currículum Vitae</a>
</div>
</div>
</div>
<div class="col-md-4">
<img src="./imagenes/sonrisa.jpg" alt="Imagen principal Jeff" class="img-fluid" />
</div>
</div>
</div>
</div>
<div id="proyectos">
<div class="col-md-12">
<div class="contenedor1">
<div class="row flex-wrap">
<div class="col-md-4">
<img src="./imagenes/arbolposelau.jpg" alt="Guardaespaldas" class="img-fluid" />
<h1>Acompañamiento canino</h1>
<p>10 años de experiencia como compañero de aventuras dentro y fuera de casa.</p>
</div>
<div class="col-md-4">
<img src="./imagenes/ajuscotres.jpg" alt="Fotografía en la montaña" class="img-fluid" />
<h1>Montañismo</h1>
<p>Ascenso y descenso de montañas con equipo especializado y rutas establecidas.</p>
</div>
<div class="col-md-4">
<img src="https://www.intermundial.es/blog/wp-content/uploads/2015/05/senderismo-perro.jpg" alt="Senderismo" class="img-fluid" />
<h1>Senderismo</h1>
<p>Recorridos a pie de senderos delimitados a través de extensos paisajes naturales.</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-12">
<div class="contenedor2">
<div class="row flex-wrap">
<div class="col-md-4">
<img src="./imagenes/buscandohongos.jpg" alt="Buscando hongos" class="img-fluid" />
<h1>Recolección de hongos</h1>
<p>Recorridos guiados durante la temporada de lluvias para la recolección de hongos
alimenticios.
</p>
</div>
<div class="col-md-4">
<img src="https://i.pinimg.com/originals/9d/e1/7d/9de17d61d98ce223f5fe73dd396531e4.gif" alt="Fotografía en la fogata" class="img-fluid" />
<h1>Campismo</h1>
<p>Campamentos al aire libre en grupo (instalación, comida e historias de terror en la fogata).
</p>
</div>
<div class="col-md-4">
<img src="./imagenes/sueter.jpg" alt="Fotografía moda" class="img-fluid" />
<h1>Probador de productos para mascota</h1>
<p>Pruebas rigurosas de productos destinados a las mascotas perrunas.</p>
</div>
</div>
</div>
</div>
<div id="habilidades">
<div class="col-md-12">
<div class="row text-center">
<div class="col-md-6">
<div class="presentacion">
<h1>Habilidades</h1>
<p>Además de ser elogiado por mi belleza, buen comportamiento y sociabilidad, entre mis
habilidades puedo mencionar la resistencia, la fuerza y el sentido de orientación que me
permiten ser un maestro de rutas, mi buen gusto y capacidad de olfatear a grandes
distancias la comida recien hecha, y mi gran destreza para tomar largas siestas. <br> Un
gran perro y sobre todo un gran amigo.
</p>
</div>
</div>
<div class="col-md-6">
<div id="carouselExampleControls" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./imagenes/caminocerro.jpg" class="d-block w-100 img-fluid"
alt="Experto en rutas" />
</div>
<div class="carousel-item">
<img src="./imagenes/comida.jpg" class="d-block w-100 img-fluid"
alt="Catador de comida" />
</div>
<div class="carousel-item">
<img src="./imagenes/dormidocobija.jpg" class="d-block w-100 img-fluid"
alt="Profesional en tomar siestas" />
</div>
</div>
<button class="carousel-control-prev" type="button"
data-bs-target="#carouselExampleControls" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Anterior</span>
</button>
<button class="carousel-control-next" type="button"
data-bs-target="#carouselExampleControls" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Siguiente</span>
</button>
</div>
</div>
</div>
</div>
</div>
<div id="videos" class="row">
<div class="col-md-6">
<video width="640" height="480" autoplay loop muted>
<source src="./imagenes/saltando.mp4" type="video/mp4">
Formato de video no admitido.
</video>
</div>
<div class="col-md-6">
<video width="640" height="480" autoplay loop muted>
<source src="./imagenes/jugandoagua.mp4" type="video/mp4">
Formato de video no admitido.
</video>
</div>
</div>
</main>
<footer id="contacto">
<div class="container">
<div class="row">
<div class="col-md-6 text-left">
<h6>Todos los derechos reservados</h6>
</div>
<div class="col-md-6 text-right">
<div class="iconos">
<a href="https://www.facebook.com/laura.dp.31/" target="_blank">
<i class="fa-brands fa-facebook-f"></i>
</a>
<a href="https://www.instagram.com/zaktuche/" target="_blank">
<i class="fa-brands fa-instagram"></i>
</a>
<a href="https://wa.me/525550425670/?text=Hola, buen día. Quisiera recibir más información sobre el licenciado Jeff."
target="blank">
<i class="fa-brands fa-whatsapp"></i>
</a>
</div>
<p class="small">Contáctame a través de las redes sociales de mi tutora. <br> Yo soy un perrito y no
sé usarlas</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>
</body>
</html>