@import url('https://fonts.googleapis.com/css?family=Poppins'); @font-face { font-family: "Libertinage x"; src: url("fonts/Libertinage-x.ttf"); } body { margin: 5em; font-family: "Libertinage x", serif; font-size: 1.1em; color: #2d2020; background: #f2eee8; } #map { background: #f2eee8 !important; } div.tile { color: #2d2020; position: absolute; pointer-events: auto; /* this enables links */ } div.tile img.imagetile { filter: grayscale(100%); /* recent browsers */ -webkit-filter: grayscale(100%); /* old webkit based browsers */ filter: gray; /* old IE until 9, then needs SVG??? */ position: absolute; left: 0; top: 0; z-index: 0; } div.tile img.imagetile:hover { filter: none; } div.tile div.text { position: absolute; left: 0; top: 0; z-index: 1; font-family: "Poppins", sans-serif; font-size: 15px; line-height: 16px; /*text-shadow: 1px 1px 2px black;*/ padding-right: 20px; padding-left: 0px; margin-top: 0px; } div.tile div.text p { font-size: 12px; /*color: #f2eee8;*/ /*background: #dd2e47;*/ margin: 0; line-height: 12px; padding-left: 10px; /*hyphens: auto;*/ } div.tile div.text a { margin: 0; text-decoration: none; color: #dd2e47; } div.tile div.text a:hover {} div.coords { pointer-events: none; display: none; } .leaflet-overlay-pane { z-index: 0 !important; /* hack to put the x underneath */ } p.caption {} p.caption span.text { /*background: #444;*/ } p.caption span.date { padding-left: 8px; /*background: #444;*/ /*color: #AAA;*/ } p.caption a.url { padding-left: 8px; /*color: #FF0;*/ } p.caption a.url:hover { /*background: #FF0;*/ /*color: black;*/ }