Website/alternatePortraitVersions/index.html

84 lines
4.0 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="../latex.css">
<link rel="stylesheet" href="../style.css">
<link rel="stylesheet" href="../accessibility.css">
<title>Alternate Portrait Versions</title>
<meta name="robots" content="noindex,nofollow">
<meta name="google-site-verification" content="DibIHTYcO0f2RAdscthaJh1g_-TNwN0vu6j25GT93kg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="Mattia Mascarello's personal website" />
<meta name="keywords" content="Mattia Mascarello, Liceo Cocito, Mordapp" />
<meta property="og:title" content="Mattia Mascarello" />
<meta property="og:url" content="https://mattiaturin.duckdns.org/" />
<meta property="og:description" content="Mattia Mascarello's personal website" />
<meta property="og:type" content="website" />
<meta property="og:image" content="https://mattiaturin.duckdns.org/images/portrait.jpg" />
<!-- Local umami analytics -->
<script defer src="https://umami.mattiaturin.duckdns.org/script.js"
data-website-id="5094aab8-a629-4939-a572-0f3dc6042c12"></script>
<link rel="apple-touch-icon" sizes="180x180" href="../images/fav/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="../images/fav/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="../images/fav/favicon-16x16.png">
<link rel="manifest" href="../images/fav/site.webmanifest">
</head>
<body>
<main>
<header>
<h1>Alternate Protrait Versions</h1>
<p>These are the variations of the main portrait which are displayed during the appropriate time frames.</p>
</header>
<a href="#" id="accessibleToggle" aria-label="Toggle accessibility mode">Accessible Mode</a>
<br />
<figure>
<div class="row">
<div class="column">
<a href="../images/portrait.jpg" target="_blank"><img src="../images/portrait.jpg" loading="lazy"
alt="Default portrait" /></a>
</div>
<div class="column">
<a href="../images/euportrait.png" target="_blank"> <img src="../images/euportrait.png" loading="lazy"
alt="Europe Day (9th of May) portrait" /></a>
</div>
<div class="column">
<a href="../images/natoportrait.png" target="_blank"> <img src="../images/natoportrait.png"
loading="lazy" alt="NATO Day (4th of April)" /></a>
</div>
<div class="column">
<a href="../images/itportrait.png" target="_blank"> <img src="../images/itportrait.png" loading="lazy"
alt="Festa della Repubblica (2nd of June)" /></a>
</div>
<div class="column">
<a href="../images/xmasportrait.png" target="_blank"> <img src="../images/xmasportrait.png"
loading="lazy" alt="Christmas (19th-26th of December)" /></a>
</div>
</div>
<figcaption>
<div id="clockwise"><b>From Top to Bottom in lines, </b></div>
<div id="topbottom"><b>From Top to Bottom,</b></div>
<div id="leftright"><b>From Left to Right,</b></div>
1) Default portrait, 2) <a
href="https://european-union.europa.eu/principles-countries-history/symbols/europe-day_en"
target="_blank">Europe Day</a> (9th of May), 3) <a href="https://en.wikipedia.org/wiki/NATO_Day">NATO
Day</a> (4th of April), 4) <a href="https://en.wikipedia.org/wiki/Festa_della_Repubblica">Festa della
repubblica</a> (2nd of June), 5) Christmas (19th-26th of December)
</figcaption>
</figure>
<br />
<p style="text-align: center;"> <a href="../">Home</a></p>
<div class="footnotes">
<p>
&copy; 2022 Mattia Mascarello
</p>
</div>
</main>
<script src="../accessibility.js"></script>
</body>
</html>