| ... | ... |
@@ -17,7 +17,8 @@ a:visited { color: #5b7e96; }
|
| 17 | 17 |
a:hover { color: #ccc; }
|
| 18 | 18 |
|
| 19 | 19 |
.holder {
|
| 20 |
- width: 80%; |
|
| 20 |
+ width: 90%; |
|
| 21 |
+ max-height: 50vh; |
|
| 21 | 22 |
} |
| 22 | 23 |
.legend {
|
| 23 | 24 |
/* Nothing Yet */ |
| ... | ... |
@@ -52,8 +53,8 @@ a:hover { color: #ccc; }
|
| 52 | 53 |
font-family: "Lucida Sans", sans-serif; |
| 53 | 54 |
} |
| 54 | 55 |
|
| 55 |
-.legend {
|
|
| 56 |
- position:absolute; |
|
| 56 |
+.legend-img {
|
|
| 57 |
+ position:relative; |
|
| 57 | 58 |
width: 40%; |
| 58 | 59 |
bottom: 1%; |
| 59 | 60 |
left: 8px; |
| ... | ... |
@@ -61,6 +62,10 @@ a:hover { color: #ccc; }
|
| 61 | 62 |
opacity: 0.7; |
| 62 | 63 |
margin: auto; |
| 63 | 64 |
} |
| 65 |
+@media only screen and (min-width: 500px) and (max-width: 699px) {
|
|
| 66 |
+ /* For phone */ |
|
| 67 |
+ .legend-img { bottom: 10%; }
|
|
| 68 |
+} |
|
| 64 | 69 |
</style> |
| 65 | 70 |
|
| 66 | 71 |
</head> |