diff --git a/styles.css b/styles.css index ad485bd..7db8999 100644 --- a/styles.css +++ b/styles.css @@ -1,21 +1,19 @@ +@import url('https://fonts.googleapis.com/css?family=Poppins'); + @font-face { font-family: "Libertinage x"; src: url("fonts/Libertinage-x.ttf"); } -@font-face { - font-family: "OSP-DIN"; - src: url("fonts/OSP-DIN.ttf"); -} body { margin: 5em; font-family: "Libertinage x", serif; font-size: 1.1em; color: #2d2020; - background: #f2eee3; + background: #f2eee8; } #map { - background: #f2eee3 !important; + background: #f2eee8 !important; } div.tile { color: #2d2020; @@ -23,31 +21,41 @@ div.tile { 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: sans-serif; + font-family: "Poppins", sans-serif; font-size: 15px; - line-height: 18px; + line-height: 16px; /*text-shadow: 1px 1px 2px black;*/ - padding-right: 10px; + padding-right: 20px; padding-left: 0px; margin-top: 0px; } div.tile div.text p { + font-size: 12px; + /*color: #f2eee8;*/ + /*background: #dd2e47;*/ margin: 0; - hyphens: auto; + line-height: 12px; + padding-left: 10px; + /*hyphens: auto;*/ } div.tile div.text a { margin: 0; text-decoration: none; - color: #f2eee3; - background: #ed4e47; + color: #dd2e47; } div.tile div.text a:hover {} div.coords {