HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.
In CodePen, whatever you write in the HTML editor is what goes within the <body>
tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html>
tag. If you want to add classes there that can affect the whole document, this is the place to do it.
In CodePen, whatever you write in the HTML editor is what goes within the <body>
tags in a basic HTML5 template. If you need things in the <head>
of the document, put that code here.
The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.
CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.
It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.
To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit-
or -moz-
.
We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).
Any URLs added here will be added as <link>
s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.
You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.
You can also link to another Pen here (use the .css
URL Extension) and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, use the appropriate URL Extension and we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.
JavaScript preprocessors can help make authoring JavaScript easier and more convenient.
Babel includes JSX processing.
Any URL's added here will be added as <script>
s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.
You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.
If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.
You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.
Search for and use JavaScript packages from npm here. By selecting a package, an import
statement will be added to the top of the JavaScript editor for this package.
Using packages here is powered by esm.sh, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ESM usage.
All packages are different, so refer to their docs for how they work.
If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.
If active, Pens will autosave every 30 seconds after being saved once.
If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.
If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.
Visit your global Editor Settings.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta property="og:title" content="A display of 19th-century skulls just got a facelift">
<title>A display of 19th-century skulls just got a facelift</title>
<style type="text/css">
a {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
body {
background: #f5f4f3;
width: 100% !important;
}
body {
-webkit-text-size-adjust: none;
}
body {
margin: 0;
padding: 0;
}
img {
border: none;
font-size: 14px;
font-weight: bold;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
text-transform: capitalize;
}
#backgroundTable {
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
}
#templateContainer {
border: none;
}
.blurb {
color: #f5f4f3;
font-size: 11px;
}
.title {
margin-top: 24px;
}
h1,
.h1 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 42px;
font-weight: bold;
line-height: 1em;
margin-top: -4px;
text-align: center;
letter-spacing: .02em;
}
h2,
.h2 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
line-height: 1em;
font-size: 39px;
letter-spacing: .02em;
text-align: center;
}
h3,
.h3 {
color: #382c14 !important;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
font-size: 32px;
line-height: 1em;
}
h4,
.h4 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
line-height: 30px;
margin-bottom: 2px;
text-align: center;
font-size: 24px;
letter-spacing: -.01em;
}
h5,
.h5 {
color: #333;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 17px;
font-weight: bold;
line-height: 100%;
margin-bottom: 26px;
margin-top: 12px;
text-align: center;
}
p,
.p,
.pAlt {
color: #333;
display: block;
font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
font-size: 19px;
line-height: 24px;
margin-top: 24px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
}
.preheaderContent div {
color: #808080;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 11px;
margin-bottom: 30px;
text-align: center;
padding: 13px 0 7px;
}
.icon {
margin-bottom: 16px;
margin-top: 6px;
}
.footer-headline {
margin-bottom: 36px;
margin-top: 8px;
}
.social-icon {
margin-right: 10px;
}
.center {
display: block;
text-align: center;
}
#footer {
color: #cfb592 !important;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 16px;
line-height: 140%;
text-decoration: none !important;
margin-bottom: 24px;
margin-top: 12px;
}
#footer a {
color: #cfb592;
text-decoration: none;
}
#footer img {
margin-bottom: 24px;
margin-top: 24px;
}
.preheaderContent div a:link,
.preheaderContent div a:visited {
color: #336699;
font-weight: normal;
text-decoration: underline;
}
#templateHeader {
border-bottom: 0;
}
.bodyContent {
background-color: #fff;
}
.spacer {
background: #f5f4f3;
height: 10px;
width: 100%;
}
.lrg-spacer {
background: #f5f4f3;
height: 20px;
width: 100%;
}
.std-spacer {
background: #f5f4f3;
height: 1px;
width: 100%;
}
h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a,
h5 a,
.h5 a {
color: #382c14;
text-decoration: none;
}
p a,
.p a {
color: #333;
text-decoration: none;
}
h6 a,
.h6 a {
color: #53b19f;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 14px;
font-weight: bold;
letter-spacing: .04em;
text-decoration: none;
text-transform: uppercase;
}
.sponsorship p strong,
.sponsorship .p strong {
color: #bd804a;
}
.sponsorhip h2,
.sponsorship .h2 {
margin-top: 8px;
}
.sponsorhip h5,
.sponsorship .h5 {
color: #bd804a;
font-size: 14px;
letter-spacing: .04em;
margin-bottom: 0;
margin-top: 35px;
text-transform: uppercase;
}
.item-supertitle,
.item-supertitle a,
.item-body-link a,
.item-body-link {
font-size: 15px;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
color: inherit;
}
.event-date,
.city-title,
.city-title a,
.event-body-link,
.event-body-link a,
.event-subtitle-cta,
.event-subtitle-cta a {
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
color: #d84875;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
}
.event-date a {
color: #d84875;
}
.event-body-link {
font-size: 15px;
}
.event-body-link:hover,
.event-body-link:focus,
.event-body-link a:hover,
.event-body-link a:focus {
text-decoration: none;
color: #000;
}
.item-body-link:hover,
.item-body-link:focus,
.item-body-link a:hover,
.item-body-link a:focus {
text-decoration: none !important;
color: #000 !important;
}
.item:hover,
.item:focus {
cursor: pointer;
}
.item:hover .event-body-link,
.item:focus .event-body-link {
text-decoration: none !important;
color: #000 !important;
}
.event-date,
.item-supertitle {
margin-bottom: 6px;
font-size: 15px;
}
.city-title {
font-size: 17px;
}
.event-body-link,
.item-body-link {
margin-top: 20px;
display: inline-block;
}
.event-header,
.card-header {
text-align: center;
padding: 0 10px;
margin-bottom: -4px;
}
.event-button {
width: 100%;
min-width: 100%;
background: #50416d;
color: #fff;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 15px;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
display: block;
padding: 16px 0;
text-align: center;
margin: 0 auto;
}
.event-button:hover,
.event-button:focus {
background: #403457;
text-decoration: none;
}
.can-hide {
padding: 32px 32px 0;
}
.item-image {
margin-bottom: 32px;
}
.letterhead-spacer {
background: #f5f4f3;
height: 18px;
width: 100%;
}
.guillemet {
vertical-align: text-top;
}
.item-supertitle.place,
.item-supertitle.place a {
color: #53b19f;
}
.item-body-link.place,
.item-body-link.place a {
color: #1b624f;
}
.item-supertitle.promo,
.item-supertitle.promo a,
.item-body-link.promo,
.item-body-link.promo a {
color: #bd804a;
}
.event-lists {
margin-top: 24px;
padding: 0 2px;
}
.event-body-list {
margin-bottom: 19px;
}
.event-list-item {
color: #333;
display: block;
font-family: "Times New Roman", Serif;
font-size: 19px;
line-height: 24px;
text-align: left;
margin-bottom: 5px;
}
.event-list-item a {
color: #000;
text-decoration: underline;
}
.float-right {
float: right;
}
.img-wrapping-link {
line-height: 0;
display: block;
background: transparent;
}
.ad-wrap {
background: #f5f4f3;
padding-top: 20px;
padding-bottom: 15px;
}
.ad-notice {
text-align: center;
font-family: "helvetica", "arial", sans-serif;
font-size: 9px;
text-transform: uppercase;
opacity: .6;
margin-bottom: 3px;
letter-spacing: .04em;
}
.center-aligned {
text-align: center;
}
.event-subtitle-cta {
margin-top: 10px;
font-size: 15px;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
body {
background: #f5f4f3;
width: 100% !important;
}
body {
-webkit-text-size-adjust: none;
}
body {
margin: 0;
padding: 0;
}
img {
border: none;
font-size: 14px;
font-weight: bold;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
text-transform: capitalize;
}
#backgroundTable {
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
}
#templateContainer {
border: none;
}
.blurb {
color: #f5f4f3;
font-size: 11px;
}
.title {
margin-top: 24px;
}
h1,
.h1 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 42px;
font-weight: bold;
line-height: 1em;
margin-top: -4px;
text-align: center;
letter-spacing: .02em;
}
h2,
.h2 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
line-height: 1em;
font-size: 39px;
letter-spacing: .02em;
text-align: center;
}
h3,
.h3 {
color: #382c14 !important;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
font-size: 32px;
line-height: 1em;
}
h4,
.h4 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
line-height: 30px;
margin-bottom: 2px;
text-align: center;
font-size: 24px;
letter-spacing: -.01em;
}
h5,
.h5 {
color: #333;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 17px;
font-weight: bold;
line-height: 100%;
margin-bottom: 26px;
margin-top: 12px;
text-align: center;
}
p,
.p,
.pAlt {
color: #333;
display: block;
font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
font-size: 19px;
line-height: 24px;
margin-top: 24px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
}
.preheaderContent div {
color: #808080;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 11px;
margin-bottom: 30px;
text-align: center;
padding: 13px 0 7px;
}
.icon {
margin-bottom: 16px;
margin-top: 6px;
}
.footer-headline {
margin-bottom: 36px;
margin-top: 8px;
}
.social-icon {
margin-right: 10px;
}
.center {
display: block;
text-align: center;
}
#footer {
color: #cfb592 !important;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 16px;
line-height: 140%;
text-decoration: none !important;
margin-bottom: 24px;
margin-top: 12px;
}
#footer a {
color: #cfb592;
text-decoration: none;
}
#footer img {
margin-bottom: 24px;
margin-top: 24px;
}
.preheaderContent div a:link,
.preheaderContent div a:visited {
color: #336699;
font-weight: normal;
text-decoration: underline;
}
#templateHeader {
border-bottom: 0;
}
.bodyContent {
background-color: #fff;
}
.spacer {
background: #f5f4f3;
height: 10px;
width: 100%;
}
.lrg-spacer {
background: #f5f4f3;
height: 20px;
width: 100%;
}
.std-spacer {
background: #f5f4f3;
height: 1px;
width: 100%;
}
h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a,
h5 a,
.h5 a {
color: #382c14;
text-decoration: none;
}
p a,
.p a {
color: #333;
text-decoration: none;
}
h6 a,
.h6 a {
color: #53b19f;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 14px;
font-weight: bold;
letter-spacing: .04em;
text-decoration: none;
text-transform: uppercase;
}
.sponsorship p strong,
.sponsorship .p strong {
color: #bd804a;
}
.sponsorhip h2,
.sponsorship .h2 {
margin-top: 8px;
}
.sponsorhip h5,
.sponsorship .h5 {
color: #bd804a;
font-size: 14px;
letter-spacing: .04em;
margin-bottom: 0;
margin-top: 35px;
text-transform: uppercase;
}
.item-supertitle,
.item-supertitle a,
.item-body-link a,
.item-body-link {
font-size: 15px;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
color: inherit;
}
.event-date,
.city-title,
.city-title a,
.event-body-link,
.event-body-link a,
.event-subtitle-cta,
.event-subtitle-cta a {
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
color: #d84875;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
}
.event-date a {
color: #d84875;
}
.event-body-link {
font-size: 15px;
}
.event-body-link:hover,
.event-body-link:focus,
.event-body-link a:hover,
.event-body-link a:focus {
text-decoration: none;
color: #000;
}
.item-body-link:hover,
.item-body-link:focus,
.item-body-link a:hover,
.item-body-link a:focus {
text-decoration: none !important;
color: #000 !important;
}
.item:hover,
.item:focus {
cursor: pointer;
}
.item:hover .event-body-link,
.item:focus .event-body-link {
text-decoration: none !important;
color: #000 !important;
}
.event-date,
.item-supertitle {
margin-bottom: 6px;
font-size: 15px;
}
.city-title {
font-size: 17px;
}
.event-body-link,
.item-body-link {
margin-top: 20px;
display: inline-block;
}
.event-header,
.card-header {
text-align: center;
padding: 0 10px;
margin-bottom: -4px;
}
.event-button {
width: 100%;
min-width: 100%;
background: #50416d;
color: #fff;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 15px;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
display: block;
padding: 16px 0;
text-align: center;
margin: 0 auto;
}
.event-button:hover,
.event-button:focus {
background: #403457;
text-decoration: none;
}
.can-hide {
padding: 32px 32px 0;
}
.item-image {
margin-bottom: 32px;
}
.letterhead-spacer {
background: #f5f4f3;
height: 18px;
width: 100%;
}
.guillemet {
vertical-align: text-top;
}
.item-supertitle.place,
.item-supertitle.place a {
color: #53b19f;
}
.item-body-link.place,
.item-body-link.place a {
color: #1b624f;
}
.item-supertitle.promo,
.item-supertitle.promo a,
.item-body-link.promo,
.item-body-link.promo a {
color: #bd804a;
}
.event-lists {
margin-top: 24px;
padding: 0 2px;
}
.event-body-list {
margin-bottom: 19px;
}
.event-list-item {
color: #333;
display: block;
font-family: "Times New Roman", Serif;
font-size: 19px;
line-height: 24px;
text-align: left;
margin-bottom: 5px;
}
.event-list-item a {
color: #000;
text-decoration: underline;
}
.float-right {
float: right;
}
.img-wrapping-link {
line-height: 0;
display: block;
background: transparent;
}
.ad-wrap {
background: #f5f4f3;
padding-top: 20px;
padding-bottom: 15px;
}
.ad-notice {
text-align: center;
font-family: "helvetica", "arial", sans-serif;
font-size: 9px;
text-transform: uppercase;
opacity: .6;
margin-bottom: 3px;
letter-spacing: .04em;
}
.center-aligned {
text-align: center;
}
.event-subtitle-cta {
margin-top: 10px;
font-size: 15px;
}
.spacer {
height: 12px;
}
.lrg-spacer {
height: 24px;
}
.newsletter-title {
text-align: left;
margin: 0;
}
.newsletter-date {
font-size: 16px;
line-height: 0;
color: #333;
display: inline-table;
white-space: nowrap;
font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
}
.article-card-body strong {
color: #009bbf;
font-weight: bold;
}
.article-card-body .item-supertitle {
display: none !important;
}
.article-card-body .p {
margin-bottom: 0;
}
.user-photo-card .p {
margin-bottom: 0;
}
.user-photo-card .p a {
color: #53b19f;
font-weight: bold;
}
.user-photo-card .p a:hover,
.user-photo-card .p a:focus {
text-decoration: underline;
}
.user-photo-card .card-header strong {
text-decoration: underline;
color: initial;
}
.place-card-body strong,
.item-body-link.place,
.item-body-link.place a {
color: #53b19f;
}
.content-swap-card-body .item-body-link,
.content-swap-card-body .item-body-link a,
.content-swap-card-body .item-supertitle,
.content-swap-card-body .item-supertitle a {
color: #d36a55;
}
.sponsor-card-body .item-body-link,
.sponsor-card-body .item-body-link a,
.sponsor-card-body .item-supertitle,
.sponsor-card-body .item-supertitle a {
color: #ccb48d;
}
.item-supertitle.place,
.item-supertitle.place a {
color: #1b624f;
}
.food-card-body strong,
.item-supertitle.food,
.item-supertitle.food a,
.item-body-link.food {
color: #f3cb00;
}
.themeweek-img-wrap {
padding: 32px 32px 0;
}
.themeweek-img {
max-width: 60%;
max-height: 50px;
}
.item-body-link {
margin-top: 0;
}
.linked-card:hover strong {
text-decoration: underline;
}
.linked-card:hover {
cursor: pointer !important;
}
.sponsor-title,
.sponsor-title a {
font-size: 15px;
font-family: "Helvetica Neue", "Helvetica", 'Century Gothic', 'CenturyGothic', 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto';
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
color: #ccb48d;
}
.sponsor-title a:hover,
.sponsor-title a:focus {
color: #ccb48d;
}
.with-top-hr {
padding: 12px;
border-top: 1px solid #ccc;
}
.forum-card-bg {
background-color: #EFE8DC;
padding: 98px 30px 24px;
}
.forum-card-icon-wrap {
max-height: 40px;
padding-left: 30px;
}
.forum-quote,
.forum-quote a {
text-decoration: none;
color: #382C14;
font-family: "Helvetica Neue", "Helvetica", 'Century Gothic', 'CenturyGothic', 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto';
font-size: 24px;
font-weight: 700;
line-height: 30px;
margin-bottom: 14px;
}
.forum-attribution,
.forum-attribution a {
text-decoration: none;
color: #858585;
font-family: "Helvetica Neue", "Helvetica", 'Century Gothic', 'CenturyGothic', 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto';
font-size: 20px;
font-weight: 400;
letter-spacing: 1px;
line-height: 16px;
}
.forum-body-link {
margin-top: 38px;
}
.forum-content-padded {
padding-left: 10px;
padding-right: 10px;
}
.quote-em-dash {
padding-right: 4px;
}
a {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
body {
background: #f5f4f3;
width: 100% !important;
}
body {
-webkit-text-size-adjust: none;
}
body {
margin: 0;
padding: 0;
}
img {
border: none;
font-size: 14px;
font-weight: bold;
height: auto;
line-height: 100%;
outline: none;
text-decoration: none;
text-transform: capitalize;
}
#backgroundTable {
height: 100% !important;
margin: 0;
padding: 0;
width: 100% !important;
}
#templateContainer {
border: none;
}
.blurb {
color: #f5f4f3;
font-size: 11px;
}
.title {
margin-top: 24px;
}
h1,
.h1 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 42px;
font-weight: bold;
line-height: 1em;
margin-top: -4px;
text-align: center;
letter-spacing: .02em;
}
h2,
.h2 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
line-height: 1em;
font-size: 39px;
letter-spacing: .02em;
text-align: center;
}
h3,
.h3 {
color: #382c14 !important;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
font-size: 32px;
line-height: 1em;
}
h4,
.h4 {
color: #382c14;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: bold;
line-height: 30px;
margin-bottom: 2px;
text-align: center;
font-size: 24px;
letter-spacing: -.01em;
}
h5,
.h5 {
color: #333;
display: block;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 17px;
font-weight: bold;
line-height: 100%;
margin-bottom: 26px;
margin-top: 12px;
text-align: center;
}
p,
.p,
.pAlt {
color: #333;
display: block;
font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
font-size: 19px;
line-height: 24px;
margin-top: 24px;
padding-left: 2px;
padding-right: 2px;
text-align: left;
}
.preheaderContent div {
color: #808080;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 11px;
margin-bottom: 30px;
text-align: center;
padding: 13px 0 7px;
}
.icon {
margin-bottom: 16px;
margin-top: 6px;
}
.footer-headline {
margin-bottom: 36px;
margin-top: 8px;
}
.social-icon {
margin-right: 10px;
}
.center {
display: block;
text-align: center;
}
#footer {
color: #cfb592 !important;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 16px;
line-height: 140%;
text-decoration: none !important;
margin-bottom: 24px;
margin-top: 12px;
}
#footer a {
color: #cfb592;
text-decoration: none;
}
#footer img {
margin-bottom: 24px;
margin-top: 24px;
}
.preheaderContent div a:link,
.preheaderContent div a:visited {
color: #336699;
font-weight: normal;
text-decoration: underline;
}
#templateHeader {
border-bottom: 0;
}
.bodyContent {
background-color: #fff;
}
.spacer {
background: #f5f4f3;
height: 10px;
width: 100%;
}
.lrg-spacer {
background: #f5f4f3;
height: 20px;
width: 100%;
}
.std-spacer {
background: #f5f4f3;
height: 1px;
width: 100%;
}
h1 a,
.h1 a,
h2 a,
.h2 a,
h3 a,
.h3 a,
h4 a,
.h4 a,
h5 a,
.h5 a {
color: #382c14;
text-decoration: none;
}
p a,
.p a {
color: #333;
text-decoration: none;
}
h6 a,
.h6 a {
color: #53b19f;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 14px;
font-weight: bold;
letter-spacing: .04em;
text-decoration: none;
text-transform: uppercase;
}
.sponsorship p strong,
.sponsorship .p strong {
color: #bd804a;
}
.sponsorhip h2,
.sponsorship .h2 {
margin-top: 8px;
}
.sponsorhip h5,
.sponsorship .h5 {
color: #bd804a;
font-size: 14px;
letter-spacing: .04em;
margin-bottom: 0;
margin-top: 35px;
text-transform: uppercase;
}
.item-supertitle,
.item-supertitle a,
.item-body-link a,
.item-body-link {
font-size: 15px;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
color: inherit;
}
.event-date,
.city-title,
.city-title a,
.event-body-link,
.event-body-link a,
.event-subtitle-cta,
.event-subtitle-cta a {
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
color: #d84875;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
}
.event-date a {
color: #d84875;
}
.event-body-link {
font-size: 15px;
}
.event-body-link:hover,
.event-body-link:focus,
.event-body-link a:hover,
.event-body-link a:focus {
text-decoration: none;
color: #000;
}
.item-body-link:hover,
.item-body-link:focus,
.item-body-link a:hover,
.item-body-link a:focus {
text-decoration: none !important;
color: #000 !important;
}
.item:hover,
.item:focus {
cursor: pointer;
}
.item:hover .event-body-link,
.item:focus .event-body-link {
text-decoration: none !important;
color: #000 !important;
}
.event-date,
.item-supertitle {
margin-bottom: 6px;
font-size: 15px;
}
.city-title {
font-size: 17px;
}
.event-body-link,
.item-body-link {
margin-top: 20px;
display: inline-block;
}
.event-header,
.card-header {
text-align: center;
padding: 0 10px;
margin-bottom: -4px;
}
.event-button {
width: 100%;
min-width: 100%;
background: #50416d;
color: #fff;
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
font-size: 15px;
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
display: block;
padding: 16px 0;
text-align: center;
margin: 0 auto;
}
.event-button:hover,
.event-button:focus {
background: #403457;
text-decoration: none;
}
.can-hide {
padding: 32px 32px 0;
}
.item-image {
margin-bottom: 32px;
}
.letterhead-spacer {
background: #f5f4f3;
height: 18px;
width: 100%;
}
.guillemet {
vertical-align: text-top;
}
.item-supertitle.place,
.item-supertitle.place a {
color: #53b19f;
}
.item-body-link.place,
.item-body-link.place a {
color: #1b624f;
}
.item-supertitle.promo,
.item-supertitle.promo a,
.item-body-link.promo,
.item-body-link.promo a {
color: #bd804a;
}
.event-lists {
margin-top: 24px;
padding: 0 2px;
}
.event-body-list {
margin-bottom: 19px;
}
.event-list-item {
color: #333;
display: block;
font-family: "Times New Roman", Serif;
font-size: 19px;
line-height: 24px;
text-align: left;
margin-bottom: 5px;
}
.event-list-item a {
color: #000;
text-decoration: underline;
}
.float-right {
float: right;
}
.img-wrapping-link {
line-height: 0;
display: block;
background: transparent;
}
.ad-wrap {
background: #f5f4f3;
padding-top: 20px;
padding-bottom: 15px;
}
.ad-notice {
text-align: center;
font-family: "helvetica", "arial", sans-serif;
font-size: 9px;
text-transform: uppercase;
opacity: .6;
margin-bottom: 3px;
letter-spacing: .04em;
}
.center-aligned {
text-align: center;
}
.event-subtitle-cta {
margin-top: 10px;
font-size: 15px;
}
.spacer {
height: 12px;
}
.lrg-spacer {
height: 24px;
}
.newsletter-title {
text-align: left;
margin: 0;
}
.newsletter-date {
font-size: 16px;
line-height: 0;
color: #333;
display: inline-table;
white-space: nowrap;
font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif;
}
.article-card-body strong {
color: #009bbf;
font-weight: bold;
}
.article-card-body .item-supertitle {
display: none !important;
}
.article-card-body .p {
margin-bottom: 0;
}
.user-photo-card .p {
margin-bottom: 0;
}
.user-photo-card .p a {
color: #53b19f;
font-weight: bold;
}
.user-photo-card .p a:hover,
.user-photo-card .p a:focus {
text-decoration: underline;
}
.user-photo-card .card-header strong {
text-decoration: underline;
color: initial;
}
.place-card-body strong,
.item-body-link.place,
.item-body-link.place a {
color: #53b19f;
}
.content-swap-card-body .item-body-link,
.content-swap-card-body .item-body-link a,
.content-swap-card-body .item-supertitle,
.content-swap-card-body .item-supertitle a {
color: #d36a55;
}
.sponsor-card-body .item-body-link,
.sponsor-card-body .item-body-link a,
.sponsor-card-body .item-supertitle,
.sponsor-card-body .item-supertitle a {
color: #ccb48d;
}
.item-supertitle.place,
.item-supertitle.place a {
color: #1b624f;
}
.food-card-body strong,
.item-supertitle.food,
.item-supertitle.food a,
.item-body-link.food {
color: #f3cb00;
}
.themeweek-img-wrap {
padding: 32px 32px 0;
}
.themeweek-img {
max-width: 60%;
max-height: 50px;
}
.item-body-link {
margin-top: 0;
}
.linked-card:hover strong {
text-decoration: underline;
}
.linked-card:hover {
cursor: pointer !important;
}
.sponsor-title,
.sponsor-title a {
font-size: 15px;
font-family: "Helvetica Neue", "Helvetica", 'Century Gothic', 'CenturyGothic', 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto';
font-weight: 600;
line-height: 1em;
letter-spacing: .12em;
text-transform: uppercase;
color: #ccb48d;
}
.sponsor-title a:hover,
.sponsor-title a:focus {
color: #ccb48d;
}
.with-top-hr {
padding: 12px;
border-top: 1px solid #ccc;
}
.forum-card-bg {
background-color: #EFE8DC;
padding: 98px 30px 24px;
}
.forum-card-icon-wrap {
max-height: 40px;
padding-left: 30px;
}
.forum-quote,
.forum-quote a {
text-decoration: none;
color: #382C14;
font-family: "Helvetica Neue", "Helvetica", 'Century Gothic', 'CenturyGothic', 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto';
font-size: 24px;
font-weight: 700;
line-height: 30px;
margin-bottom: 14px;
}
.forum-attribution,
.forum-attribution a {
text-decoration: none;
color: #858585;
font-family: "Helvetica Neue", "Helvetica", 'Century Gothic', 'CenturyGothic', 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto';
font-size: 20px;
font-weight: 400;
letter-spacing: 1px;
line-height: 16px;
}
.forum-body-link {
margin-top: 38px;
}
.forum-content-padded {
padding-left: 10px;
padding-right: 10px;
}
.quote-em-dash {
padding-right: 4px;
}
.simplified-template .card-header {
padding: 0;
}
.simplified-template .p {
margin-top: 20px;
line-height: 28px;
letter-spacing: .19px;
}
.simplified-template .item-image {
margin-bottom: 25px;
}
.left-aligned {
text-align: left !important;
}
.right-aligned {
text-align: right !important;
}
.sans {
font-family: "Helvetica Neue", "Helvetica", 'Arial', sans-serif, 'normal', 'Droid Sans', 'Roboto' !important;
}
.serif {
font-family: TimesNewRoman, Times New Roman, Times, Baskerville, Georgia, serif !important;
}
.simplified-template .simplified-color,
.simplified-template .simplified-color a,
.simplified-template .simplified-color a:hover,
.simplified-template .simplified-color a:focus {
color: #bd8049;
}
.simplified-template .item-body-link {
margin-top: 20px;
}
.footer-outlink img {
height: 95px;
max-height: 95px;
width: auto;
display: inline-block;
margin: 0 0 10px;
}
#newsletters-link.footer-outlink {
text-align: right;
}
#newsletters-link.footer-outlink img {
height: 93px;
}
.footer-outlink {
width: 45%;
max-width: 172px;
padding-right: 50px;
}
.nondecorated {
text-decoration: none !important;
}
#newsletters-link {
padding-right: 0;
}
.outlink-row {
text-align: left;
padding-top: 10px;
}
.tagline-sprite {
display: inline-block;
height: 35px;
max-height: 35px;
}
.tagline-row {
text-align: left;
margin-bottom: 29px;
margin-top: 10px;
}
.top-border-item {
border-top: 1px solid #e7e7e7;
padding-top: 32px;
}
.social-row {
margin-bottom: 10px;
}
.footer-address {
color: #666666;
font-size: 11px;
letter-spacing: .27px;
line-height: 19px;
}
.footer-address a {
text-decoration: none !important;
}
#footer-inline-links {
color: #bd8049;
}
#footer-inline-links a {
color: #bd8049;
font-size: 11px;
letter-spacing: .78px;
line-height: 15px;
text-decoration: underline;
font-weight: normal;
text-align: center;
}
#footer-inline-links {
margin: 13px 0 10px;
}
.inline-pipe {
vertical-align: baseline;
font-size: 11px;
margin: 0 1px;
}
#footer-inline-links.top-border-item {
padding-top: 14px;
}
#footer-inline-links a,
#footer-inline-links a:hover,
#footer-inline-links a:focus {
color: #bd8049 !important;
}
.social-row a {
display: inline-block;
margin-right: 20px;
}
.social-sprite {
height: 20px;
width: auto;
}
.sponsored-subhead {
letter-spacing: .27px;
width: 100%;
}
.header-date {
white-space: nowrap;
min-width: 130px;
line-height: 13px;
padding-top: 13px;
}
.header-date,
.sponsored-subhead {
font-size: 13px;
color: #333;
}
.sponsored-subhead {
margin-bottom: 20px;
white-space: nowrap;
}
.sponsored-subhead .sans {
margin: 13px 10px 13px 0;
display: inline-block;
line-height: 26px;
vertical-align: middle;
color: #382c14;
}
.sponsored-subhead a {
text-decoration: none;
color: #382c14 !important;
}
#sponsored-img {
min-height: 20px;
width: auto;
max-height: 26px;
display: inline-block;
vertical-align: middle;
}
.left-padded {
padding-left: 30px;
}
.right-padded {
padding-right: 30px;
}
.content-width {
width: 100%;
min-width: 415px;
}
.sm-spacer {
height: 7px;
}
.lede-card-body {
padding: 0 5px 5px;
}
</style>
<!--[if !mso]>
<!-->
<link href="https://fonts.googleapis.com/css?family=Roboto:400,400i,700,700i" rel="stylesheet">
<!--<![endif]-->
</head>
<body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="background: #f5f4f3;-webkit-text-size-adjust: none;margin: 0;padding: 0;width: 100% !important;">
<center>
<table border="0" cellpadding="0" cellspacing="5" width="485" id="backgroundTable" class="simplified-template" style="height: 100%;margin: 0;padding: 0;width: 100% !important;">
<tbody>
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="475" id="templatePreheader">
<tbody>
<tr>
<td valign="top" class="preheaderContent">
<div style="color: #808080;font-size: 11px;margin-bottom: 30px;text-align: center;padding: 13px 0 7px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">
<span class="blurb" style="color: #f5f4f3;font-size: 11px;">Haunting coffee, library apartments, and more.
</span>
<br>
Email not displaying correctly? <a href="#" target="_blank" style="text-decoration: underline;color: #336699;font-weight: normal;">View in your browser</a>.
</div>
</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="475" id="templateContainer" style="border: none;">
<!-- campaign content start -->
<tbody>
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="475" align="center">
<tbody>
<tr>
<td valign="top">
<a id="masthead-link" class="nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=210d2dbf2d&e=dfc4bff28b" target="_blank" style="text-decoration: none !important;">
<img class="mcnImage header-logo" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/73ed94ee-f881-4ea1-8e1f-44f98483021c.png" width="203" alt="73ed94ee-f881-4ea1-8e1f-44f98483021c.png" style="border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;"></a>
</td>
<td valign="top">
<div class="header-date sans right-aligned" style="white-space: nowrap;min-width: 130px;line-height: 13px;padding-top: 13px;font-size: 13px;color: #333;text-align: right !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">October 26, 2021</div>
</td>
</tr>
<tr>
<td valign="bottom" width="100%">
<div style="height:12px;"></div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center" width="100%">
</td>
</tr>
<tr>
<td align="center" valign="top">
<table border="0" cellpadding="0" cellspacing="0" width="475" id="templateBody">
<tbody>
<tr>
<td valign="top" class="bodyContent" style="background-color: #fff;">
<!-- Start Hero and Intro -->
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=8410f20cec&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/d2c674a6-2bf6-d031-48bf-d73054ec95e9.jpeg" alt="" border="0" style="margin: 0;padding: 0;max-width: 475px;max-height: 268px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;" width="475"></a>
<br>
<table border="0" cellpadding="25" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top">
<div class="card-body lede-card-body" style="padding: 0 5px 5px;">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=6635736ce6&e=dfc4bff28b" target="_blank" style="text-decoration: none;color: #382c14;">Skull Afterlives</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=bcf3c6d050&e=dfc4bff28b" style="text-decoration: none;color: #333;">For visitors, Philadelphia’s Mütter Museum offers an unexpected glimpse into the world of 19th-century medicine, and allows them to come face-to-face with the debates that still haunt modern medical ethics. Perhaps the best example of this spirit is the Hyrtl Skull Collection, 139 human skulls that were gathered in an effort to disprove the racist theories of phrenologists who believed cranial shape dictated intelligence and personality. For decades the skulls sat in their original cases on a catwalk, with only small alterations being made to the popular display. That all changed in September 2021 when the museum unveiled its latest move—a complete renovation of the exhibit. </a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=9eeec08258&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<div class="lrg-spacer" style="background: #f5f4f3;height: 24px;width: 100%;"></div>
<!-- End Hero and Intro -->
<!-- Start Simplified Repeatable Module -->
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="0">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=198ffe4683&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/14b16371-6a81-e1e2-13c4-75244acc7ec0.jpg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=81123682eb&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Gastro Obscura</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=98dc3df938&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">Have a Cold Boo</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=072df6cbac&e=dfc4bff28b" style="text-decoration: none;color: #333;">Want a good brew to start your mornings off (f)right? Then you might want to visit Hirosaki, Japan, home to “Tsugaru Haunted Coffee,” which draws on supernatural legends from Japanese mythology. Each packet of coffee depicts a ghost or monster haunting different parts of the city. The single-serving drip coffee sachets are carefully packed by hand by Tsugaru Net, a “B-corporation” social enterprise in central Hirosaki that provides employment opportunities for people with physical, intellectual, and mental disabilities.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=567ff43490&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="1">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=8a2dcfb595&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/3671f43f-a5cd-f263-d008-97a7a1cc8d63.jpeg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=72cb29805c&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Šibenik, Croatia</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=1e855a9b80&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">Sea Tunnel at St. Anthony’s Canal</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=35beca4b0e&e=dfc4bff28b" style="text-decoration: none;color: #333;">This channel is a natural phenomenon and was named after Saint Anthony the Abbot. It is the only natural water route to Šibenik. Two holes in the coast form the entry into an underground water bypass built by the Germans in the 20th century. They allowed military boats and torpedo boats to access or to leave the city of Šibenik by water, bypassing underwater-located mine barriers during war times.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=d43e494160&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="2">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=ad1062640e&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/01002158-51d9-0113-b484-d8f1b8bfd48e.jpg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=eaff04622f&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Atlas Obscura Experiences</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=1a7637c413&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">Inside the Schomburg Center for Research in Black Culture</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=48b492f989&e=dfc4bff28b" style="text-decoration: none;color: #333;">Join us for a behind-the-scenes look at the Schomburg Center's massive collection of over 11 million items that illustrate African American, African Diaspora, and African experiences - from traditional African masks to modern hip hop recordings.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=ca9f8b9460&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Get Tickets <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="3">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=34e83973bd&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/a9ff4d12-f948-e80f-a43e-55414104266b.jpeg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=d71185897c&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">FROM THE ARCHIVES</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=7f7da191bd&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">The Last Library Apartments</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=5e4be1d1ea&e=dfc4bff28b" style="text-decoration: none;color: #333;">There used to be apartments on the top floors of New York City’s branch libraries. When these libraries were built, about a century ago, they needed people to take care of them. These buildings were heated by coal, so each had a custodian, who was tasked with keeping those fires burning and who lived in the library, often with his family. But many of these apartments have vanished; today there are just 13 library apartments left in the New York Public Library system.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=62205d74a6&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="4">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=e9e89e9130&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/ff667542-c57b-5851-81de-5084e3121f4c.jpeg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=f57f02f4fd&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Union, Illinois</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=0a33f3a4a6&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">Illinois Railway Museum</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=ac6d62fe92&e=dfc4bff28b" style="text-decoration: none;color: #333;">Who doesn’t want to ride in a life-sized Thomas the Tank engine? That’s one of the items in the collection at the Illinois Railway Museum, which was founded in 1953 by ten men who each contributed $100 to purchase Indiana Railroad 65, a recently retired interurban car that was on the verge of being scrapped. Since then, it has grown into the largest railway museum in the United States, with a collection filled with working trains including steam, diesel, and electric models.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=d20d0c8b39&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="5">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=d7eabe1561&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/6019206e-c1ca-7969-bdfd-b1b5b254e4b5.jpeg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=b8600d6b5a&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Atlas Obscura Podcast</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=dc4e16d9c2&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">The Real Alchemist of Castle Frankenstein</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=cb51d1f269&e=dfc4bff28b" style="text-decoration: none;color: #333;">In this episode of The Atlas Obscura Podcast, two members of the Atlas Obscura team go in search of the true story that may have inspired the literary classic, Mary Shelley’s Frankenstein; or, The Modern Prometheus. Our journey begins here, where more than 300 years ago, this castle was home to the von Frankenstein family, and home to a child who grew up to become what we might today call a mad scientist. Cue spooky music.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=b4db2388d5&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Listen on Our Site <span>→</span></a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=2152879321&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Listen on Apple Podcasts <span>→</span></a></div>
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=4aa76d3950&e=dfc4bff28b" style="text-decoration: none;"> </a>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=f21cd938ea&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Listen on Spotify <span>→</span></a></div>
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=2a5241b660&e=dfc4bff28b" style="text-decoration: none;"> </a>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=720e8437f7&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Listen on Stitcher <span>→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="6">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=1ced106463&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/e87f9059-b5af-ac98-b1f5-9916379f25ab.jpeg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=54b070fba8&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">FROM THE ARCHIVES</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=534e56d7f7&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">Deadly Shortcuts</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=6fe26810f8&e=dfc4bff28b" style="text-decoration: none;color: #333;">In the summer of 1846, a party of 89 emigrants was making its way westward along the Oregon Trail. Tired, hungry, and trailing behind schedule, they decided to use a shortcut known as the “Hastings Cutoff,” which claimed to shave at least 300 miles off the journey. It did not. In fact, it cost them precious weeks, and when snow fell, that party—known now as the infamous Donner-Reed party—was trapped. How did a shortcut go so wrong?</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=1a7e8d999d&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="7">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=c21e9bdbc6&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/baf88196-4bf4-4ad8-8e92-457a6b7c59a1.jpg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=3c7dbd06b0&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">SMITHFIELD, VIRGINIA</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=0e6383cb47&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">World’s Oldest Edible Ham</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=5bac7ea032&e=dfc4bff28b" style="text-decoration: none;color: #333;">This ham is reportedly the oldest in the world. It was originally cured in 1902 by the Gwaltney Foods meat company before it was lost in storage. But if its storied history wasn't enough to make it famous, it was once also a "pet ham," with its owner even putting a brass collar on it and parading it around. Talk about hamming it up, huh?</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=01fc31e26d&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Read more <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div mc:repeatable="repeat_1" mc:variant="Variable Content" mc:repeatindex="8">
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
<table border="0" cellpadding="30" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top" class="linked-card">
<a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=a62c482613&e=dfc4bff28b" target="_blank" style="text-decoration: none;"><img src="https://mcusercontent.com/399fc0402f1b154b67965632e/images/e9b39776-54f0-d3c0-9afb-3c25548b6a6e.jpg" alt="" border="0" style="margin: 0;padding: 0;max-width: 411px;max-height: 232px;border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;margin-bottom: 25px;" width="411" class="item-image"></a>
<br>
<div class="card-body">
<div>
<div class="card-header left-aligned" style="text-align: left !important;padding: 0;margin-bottom: -4px;">
<div class="item-supertitle simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-bottom: 6px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=adbe78d4a4&e=dfc4bff28b" target="_blank" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Atlas Obscura Experiences | Halloweek</a></div>
<div class="h3" style="display: block;font-weight: bold;font-size: 32px;line-height: 1em;color: #382c14 !important;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=d2d155b2e7&e=dfc4bff28b" style="text-decoration: none;color: #382c14;">Language of Art: Ghosts and the Occult in Art</a></div>
</div>
<div class="p serif" style="color: #333;display: block;font-family: TimesNewRoman,Times New Roman,Times,Baskerville,Georgia,serif !important;font-size: 19px;line-height: 28px;margin-top: 20px;padding-left: 2px;padding-right: 2px;text-align: left;letter-spacing: .19px;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=530b60f6b4&e=dfc4bff28b" style="text-decoration: none;color: #333;">Prepare for a Halloween-inspired experience in art. Join art lecturer Regina Mamou of Art Muse Los Angeles to explore paranormal, witchcraft, and magic influences in art and learn to decipher symbols in works of art.</a></div>
<div class="item-body-link simplified-color" style="font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;margin-top: 20px;display: inline-block;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;"><a href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=181503baec&e=dfc4bff28b" style="text-decoration: none;font-size: 15px;font-weight: 600;line-height: 1em;letter-spacing: .12em;text-transform: uppercase;color: #bd8049;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Get Tickets <span class="guillemet" style="vertical-align: text-top;">→</span></a></div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- End Simplified Repeatable Module -->
<!-- Start Forum Module -->
<!-- End Forum Module -->
<div class="lrg-spacer" style="background: #f5f4f3;height: 24px;width: 100%;"></div>
</td>
</tr>
</tbody>
</table>
<!-- START Footer content -->
<table width="475" border="0" cellpadding="30" cellspacing="0" bgcolor="#ffffff">
<tbody>
<tr>
<td align="left" valign="bottom">
<div class="outlink-row content-width" style="text-align: left;padding-top: 10px;width: 100%;min-width: 415px;">
<a id="place-link" class="footer-outlink nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=c2c7d341e3&e=dfc4bff28b" style="text-decoration: none !important;width: 45%;max-width: 172px;padding-right: 50px;">
<img alt="Add a place to the Atlas" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/50efbd92-2529-4df5-8eeb-95cd9eeb21f7.png" style="border: none;font-size: 14px;font-weight: bold;height: 95px;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;max-height: 95px;width: auto;display: inline-block;margin: 0 0 10px;"></a>
<a id="newsletters-link" class="footer-outlink nondecorated" href="#" style="text-decoration: none !important;width: 45%;max-width: 172px;padding-right: 0;text-align: right;">
<img alt="Subscribe to our other newsletters" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/172a232c-2b2f-4442-9eba-06d7d7a046a9.png" style="border: none;font-size: 14px;font-weight: bold;height: 93px;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;max-height: 95px;width: auto;display: inline-block;margin: 0 0 10px;"></a>
</div>
</td>
</tr>
</tbody>
</table>
<table width="475" border="0" cellpadding="0" cellspacing="0" bgcolor="#f5f4f3">
<tbody>
<tr>
<td>
<div class="std-spacer" style="background: #f5f4f3;height: 1px;width: 100%;"></div>
</td>
</tr>
</tbody>
</table>
<table width="475" border="0" cellpadding="30" cellspacing="0" bgcolor="#ffffff">
<tbody>
<tr>
<td align="left" valign="bottom" class="limit-to-template-max-width">
<div class="tagline-row" style="text-align: left;margin-bottom: 29px;margin-top: 10px;">
<a id="tagline-link" class="nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=60248fd19c&e=dfc4bff28b" style="text-decoration: none !important;">
<img id="full-tagline" alt="The definitive guide to the world's hidden wonders." src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/255522d9-e507-48a7-a653-df54f573e6f4.png" width="310" style="border: none;font-size: 14px;font-weight: bold;height: auto;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;"></a>
</div>
<div class="social-row left-margined" style="margin-bottom: 10px;">
<a class="nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=2a75a9cbf3&e=dfc4bff28b" style="text-decoration: none !important;display: inline-block;margin-right: 20px;">
<img id="facebook" class="social-sprite" alt="Facebook" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/4e43ce8b-f7ac-419d-9de3-ce96b3fa8fd5.png" height="20" style="border: none;font-size: 14px;font-weight: bold;height: 20px;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;width: auto;"></a>
<a class="nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=6af38ef5d4&e=dfc4bff28b" style="text-decoration: none !important;display: inline-block;margin-right: 20px;">
<img id="twitter" class="social-sprite" alt="Twitter" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/8ae31b5b-a5ab-447d-9e54-03bf7562db3d.png" height="20" style="border: none;font-size: 14px;font-weight: bold;height: 20px;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;width: auto;"></a>
<a class="nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=d37764a1f0&e=dfc4bff28b" style="text-decoration: none !important;display: inline-block;margin-right: 20px;">
<img id="instagram" class="social-sprite" alt="Instagram" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/79689903-ead9-474a-b88b-be40be01b52d.png" height="20" style="border: none;font-size: 14px;font-weight: bold;height: 20px;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;width: auto;"></a>
<a class="nondecorated" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=056de8f5ab&e=dfc4bff28b" style="text-decoration: none !important;display: inline-block;margin-right: 20px;">
<img id="youtube" class="social-sprite" alt="Instagram" src="https://gallery.mailchimp.com/399fc0402f1b154b67965632e/images/da028dab-1730-4a2c-b3a8-311d8d701b58.png" height="20" style="border: none;font-size: 14px;font-weight: bold;height: 20px;line-height: 100%;outline: none;text-decoration: none;text-transform: capitalize;width: auto;"></a>
</div>
</td>
</tr>
</tbody>
</table>
<table width="475">
<tbody>
<tr>
<td align="center" valign="bottom">
<div id="footer-inline-links" style="color: #bd8049;margin: 13px 0 10px;">
<a class="sans" href="https://atlasobscura.us1.list-manage.com/track/click?u=399fc0402f1b154b67965632e&id=76453d6439&e=dfc4bff28b" style="text-decoration: underline;color: #bd8049 !important;font-size: 11px;letter-spacing: .78px;line-height: 15px;font-weight: normal;text-align: center;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Visit AtlasObscura.com</a> <span class="inline-pipe" style="vertical-align: baseline;font-size: 11px;margin: 0 1px;">·</span> <a class="sans" href="#" style="text-decoration: underline;color: #bd8049 !important;font-size: 11px;letter-spacing: .78px;line-height: 15px;font-weight: normal;text-align: center;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">View in Browser</a> <span class="inline-pipe" style="vertical-align: baseline;font-size: 11px;margin: 0 1px;">·</span> <a class="sans" href="#" style="text-decoration: underline;color: #bd8049 !important;font-size: 11px;letter-spacing: .78px;line-height: 15px;font-weight: normal;text-align: center;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">Unsubscribe</a> <span class="inline-pipe" style="vertical-align: baseline;font-size: 11px;margin: 0 1px;">·</span> <a class="sans" href="#" style="text-decoration: underline;color: #bd8049 !important;font-size: 11px;letter-spacing: .78px;line-height: 15px;font-weight: normal;text-align: center;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">See All Newsletters</a>
</div>
<div class="footer-address sans" style="color: #666666;font-size: 11px;letter-spacing: .27px;line-height: 19px;font-family: "Helvetica Neue","Helvetica",'Arial',sans-serif,'normal','Droid Sans','Roboto' !important;">61 Greenpoint Ave #622, Brooklyn, NY 11222</div>
</td>
</tr>
<tr>
<td align="center" valign="top">
<div class="lrg-spacer" style="background: #f5f4f3;height: 24px;width: 100%;"></div>
</td>
</tr>
</tbody>
</table>
<!-- END Footer content -->
</td>
</tr>
<!-- campaign content end -->
</tbody>
</table>
<!-- MC content end -->
</td>
</tr>
</tbody>
</table>
</center>
</body>
</html>
Also see: Tab Triggers