-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
120 lines (120 loc) · 8.6 KB
/
Copy pathindex.html
File metadata and controls
120 lines (120 loc) · 8.6 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="description" content="Microscopic images of Kitty's claws from the Quanta 600 FEG Environmental Scanning Electron Microscope in the Nanoscale Characterization Facility at the Krishna P. Singh Center for Nanotechnology at the University of Pennsylvania.">
<meta name="keywords" content="Kitty, claw, cat, feline, nail, Quanta 600 FEG Environmental Scanning Electron Microscope, quanta, esem, sem, scanning microscope, electron microscope, scanning electron microscope, singh, upenn, penn">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Kitty's Claws">
<meta property="og:title" content="Kitty's Claws @ Quanta 600 FEG Environmental Scanning Electron Microscope / University of Pennsylvania">
<meta property="og:description" content="Microscopic images of Kitty's claws from the Quanta 600 FEG Environmental Scanning Electron Microscope in the Nanoscale Characterization Facility at the Krishna P. Singh Center for Nanotechnology at the University of Pennsylvania.">
<meta property="og:url" content="https://www.seas.upenn.edu/~ericoc/kitty-claws/">
<meta property="og:image" content="https://www.seas.upenn.edu/~ericoc/kitty-claws/favicon.png">
<link rel="shortcut icon" href="https://www.seas.upenn.edu/~ericoc/kitty-claws/favicon.ico">
<link rel="apple-touch-icon" href="https://www.seas.upenn.edu/~ericoc/kitty-claws/favicon.png">
<title>Kitty's Claws @ Quanta 600 FEG ESEM / University of Pennsylvania</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="bootstrap-5.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="bootstrap-icons-1.13.1/bootstrap-icons.min.css">
<link href="lightbox2/css/lightbox.min.css" rel="stylesheet">
<style>
body { background-color: #323639; color: #d6d6d7; }
a, a:link, a:visited, .nav-item a, .nav-item a:link, .nav-item a:visited { color: #f4a460; text-decoration: none; }
a:active, a:hover, .nav-item a:hover { text-decoration: underline; }
.icon-link-hover { --bs-icon-link-transform: translate3d(0, -.3rem, 0); }
.border-claw { border-radius: 1rem; border-width: 0.175rem; border-style: solid; border-color: #f4a460; }
.img-claw { width: 25%; }
.logo { height: 2.5rem; }
#overview img { width: 40%; }
</style>
</head>
<body>
<header class="container-fluid p-1 row">
<span class="col text-start" title="Kitty's Claws">
<img class="logo navbar-brand" src="favicon.png" alt="Kitty" aria-hidden="true">
<a class="h2" href="https://www.seas.upenn.edu/~ericoc/kitty-claws/#title" id="title">
<i>Kitty</i>'s Claws
</a>
</span>
<span class="col h4 text-end">
<a id="microscope" href="https://www.nano.upenn.edu/equipment/quanta-600-feg-esem/" target="_blank">Quanta 600 FEG ESEM</a>
</span>
</header>
<main class="container-fluid border-top border-warning-subtle">
<div id="pictures" class="text-center m-1">
<a href="images/claws_overview.png" id="overview" data-lightbox="claws" data-title="Claws Overview" target="_blank">
<img alt="Claws Overview" class="border-claw m-1" src="images/claws_overview.png">
</a>
<p class="lead text-center px-5 my-3">
These are microscopic images taken of my cats (<i>Kitty</i>) claws.
</p>
<hr class="border-claw">
<a href="images/claw_inner_sheath.png" id="sheath" data-lightbox="claws" data-title="Claw Inner Sheath" target="_blank">
<img alt="Claw Inner Sheath" class="border-claw img-claw m-1" src="images/claw_inner_sheath.png">
</a>
<a href="images/claw_001.png" id="001" data-lightbox="claws" data-title="Claw 001" target="_blank">
<img alt="Claw 001" class="border-claw img-claw m-1" src="images/claw_001.png">
</a>
<a href="images/claw_002.png" id="002" data-lightbox="claws" data-title="Claw 002" target="_blank">
<img alt="Claw 002" class="border-claw img-claw m-1" src="images/claw_002.png">
</a>
<a href="images/claw_003.png" id="003" data-lightbox="claws" data-title="Claw 003" target="_blank">
<img alt="Claw 003" class="border-claw img-claw m-1" src="images/claw_003.png">
</a>
<a href="images/claw_004.png" id="004" data-lightbox="claws" data-title="Claw 004" target="_blank">
<img alt="Claw 004" class="border-claw img-claw m-1" src="images/claw_004.png">
</a>
<a href="images/claw_005.png" id="005" data-lightbox="claws" data-title="Claw 005" target="_blank">
<img alt="Claw 005" class="border-claw img-claw m-1" src="images/claw_005.png">
</a>
<a href="images/claw_006.png" id="006" data-lightbox="claws" data-title="Claw 006" target="_blank">
<img alt="Claw 006" class="border-claw img-claw m-1" src="images/claw_006.png">
</a>
<a href="images/claw_007.png" id="007" data-lightbox="claws" data-title="Claw 007" target="_blank">
<img alt="Claw 007" class="border-claw img-claw m-1" src="images/claw_007.png">
</a>
<a href="images/claw_008.png" id="008" data-lightbox="claws" data-title="Claw 008" target="_blank">
<img alt="Claw 008" class="border-claw img-claw m-1" src="images/claw_008.png">
</a>
<a href="images/claw_009.png" id="009" data-lightbox="claws" data-title="Claw 009" target="_blank">
<img alt="Claw 009" class="border-claw img-claw m-1" src="images/claw_009.png">
</a>
<a href="images/claw_010.png" id="010" data-lightbox="claws" data-title="Claw 010" target="_blank">
<img alt="Claw 010" class="border-claw img-claw m-1" src="images/claw_010.png">
</a>
<a href="images/claw_011.png" id="011" data-lightbox="claws" data-title="Claw 011" target="_blank">
<img alt="Claw 011" class="border-claw img-claw m-1" src="images/claw_011.png">
</a>
</div>
</main>
<footer class="border-top border-warning-subtle container-fluid row p-3">
<div class="col h6 text-start">
<a class="icon-link icon-link-hover" href="https://www.nano.upenn.edu/resources/nanoscale-characterization/" id="ncf" target="_blank" title="Nanoscale Characterization Facility <https://www.nano.upenn.edu/resources/nanoscale-characterization/>">
<svg class="bi text-danger" aria-hidden="true">
<use xlink:href="bootstrap-icons-1.13.1/bootstrap-icons.svg#balloon-heart"></use>
</svg>
<i>Nanoscale Characterization Facility</i>
</a>
</div>
<div class="col h6 text-center">
<a class="icon-link icon-link-hover" href="https://www.seas.upenn.edu/~ericoc/microscopic-imgs/" id="see-more" target="_blank" title="See more microscopic images? <https://www.seas.upenn.edu/~ericoc/microscopic-imgs/>">
<svg class="bi text-info" aria-hidden="true">
<use xlink:href="bootstrap-icons-1.13.1/bootstrap-icons.svg#eye"></use>
</svg>
<i>See more small stuff?</i>
</a>
</div>
<div class="col h6 text-end">
<a class="icon-link icon-link-hover" href="https://www.nano.upenn.edu/" id="singh" target="_blank" title="Singh Center for Nanotechnology <https://www.nano.upenn.edu/>">
<svg class="bi text-success" aria-hidden="true">
<use xlink:href="bootstrap-icons-1.13.1/bootstrap-icons.svg#building"></use>
</svg>
<i>Singh Center for Nanotechnology</i>
</a>
</div>
</footer>
<script src="bootstrap-5.3.7-dist/js/bootstrap.bundle.min.js"></script>
<script src="lightbox2/js/lightbox-plus-jquery.min.js"></script>
</body>
</html>