Genuinita - Massimo Pandolfo - Business Card
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Massimo Pandolfo – vCard</title>
<!-- Microformati hCard per compatibilità con tool che leggono i contatti -->
<!-- Riferimento: hCard / vCard microformats [web:71][web:75] -->
<style>
body {
font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
background: #f5f5f5;
margin: 0;
padding: 0;
display: flex;
min-height: 100vh;
justify-content: center;
align-items: center;
}
.card {
background: #ffffff;
padding: 1.8rem;
border-radius: 14px;
box-shadow: 0 8px 25px rgba(0,0,0,0.08);
max-width: 380px;
width: 100%;
}
.header {
display: flex;
align-items: center;
gap: 1rem;
margin-bottom: 1rem;
}
.photo {
width: 72px;
height: 72px;
border-radius: 50%;
background: #ddd;
object-fit: cover;
}
h1 {
font-size: 1.4rem;
margin: 0;
}
.role {
font-size: 0.95rem;
color: #555;
}
.org {
font-size: 0.9rem;
color: #777;
}
.section-title {
font-size: 0.85rem;
text-transform: uppercase;
letter-spacing: 0.06em;
color: #999;
margin-top: 1.2rem;
margin-bottom: 0.4rem;
}
.contact-list,
.social-list {
list-style: none;
padding: 0;
margin: 0;
font-size: 0.95rem;
}
.contact-list li,
.social-list li {
margin-bottom: 0.35rem;
}
a {
color: #0066cc;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
.about {
font-size: 0.95rem;
color: #444;
margin-top: 0.4rem;
}
.download {
margin-top: 1.2rem;
text-align: center;
}
.btn {
display: inline-block;
padding: 0.5rem 1.1rem;
border-radius: 999px;
background: #0066cc;
color: #fff;
font-size: 0.9rem;
text-decoration: none;
}
.btn:hover {
background: #004f9e;
}
</style>
</head>
<body>
<main class="card vcard">
<header class="header">
<!-- Sostituisci src con una tua foto (opzionale) -->
<img src="https://media.licdn.com/dms/image/v2/D4D03AQG2wioN39SpwQ/profile-displayphoto-shrink_400_400/B4DZPZVsBgHYAg-/0/1734518162030?e=1775088000&v=beta&t=wFtak2tJld526da_miU5MdauYBgpXoVgKo7R6s7NT8U" alt="Foto di Massimo Pandolfo" class="photo photo" />
<div>
<h1 class="fn">Massimo Pandolfo</h1>
<div class="role title">Director</div>
<div class="org">Genuinità Ltd</div>
</div>
</header>
<section>
<p class="about note">
Only genuine products from Italy.
</p>
</section>
<section>
<h2 class="section-title">Contatti</h2>
<ul class="contact-list">
<li>
Tel: <a class="tel" href="tel:+441234567890">+44 7539 822561</a>
</li>
<li>
Email:
<a class="email" href="mailto:massimo.pandolfo@genuinita.co.uk">massimo.pandolfo@genuinita.co.uk</a>
</li>
<li>
Sito:
<a class="url" href="https://www.genuinita.eu" target="_blank" rel="noopener">
www.genuinita.eu
</a>
</li>
<li class="adr">
<span class="locality">London</span>,
<span class="country-name">UK</span>
</li>
<li class="adr">
<span class="locality">Perugia</span>,
<span class="country-name">Italy</span>
</li>
</ul>
</section>
<section>
<h2 class="section-title">Social</h2>
<ul class="social-list">
<li>
LinkedIn:
<a href="https://www.linkedin.com/in/massimo-pandolfo-ab709b3" target="_blank" rel="noopener">
linkedin.com/in/massimo-pandolfo-ab709b3
</a>
</li>
<li>
Facebook:
<a href="https://www.facebook.com/eatitalian.for.real" target="_blank" rel="noopener">
facebook.com/eatitalian.for.real
</a>
</li>
<li>
Instagram:
<a href="https://www.instagram.com/genuin_ita/" target="_blank" rel="noopener">
instagram.com/genuin_ita/
</a>
</li>
</ul>
</section>
<!-- Opzionale: link a un file .vcf scaricabile con la vCard standard -->
<section class="download">
<a class="btn" href="./genuinita-massimo-pandolfo.vcf">
Scarica contatto (.vcf)
</a>
</section>
</main>
</body>
</html>