Line 11: | Line 11: | ||
padding:0; | padding:0; | ||
} | } | ||
+ | .modal { | ||
+ | display: none; /* Hidden by default */ | ||
+ | position: fixed; /* Stay in place */ | ||
+ | z-index: 1; /* Sit on top */ | ||
+ | left: 0; | ||
+ | top: 0; | ||
+ | width: 100%; /* Full width */ | ||
+ | height: 100%; /* Full height */ | ||
+ | overflow: auto; /* Enable scroll if needed */ | ||
+ | background-color: rgb(0,0,0); /* Fallback color */ | ||
+ | background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ | ||
+ | } | ||
+ | .modal-content { | ||
+ | background-color: #fefefe; | ||
+ | margin: 15% auto; /* 15% from the top and centered */ | ||
+ | padding: 20px; | ||
+ | border: 1px solid #888; | ||
+ | width: 80%; /* Could be more or less, depending on screen size */ | ||
+ | } | ||
+ | /* The Close Button */ | ||
+ | .close { | ||
+ | color: #aaa; | ||
+ | float: right; | ||
+ | font-size: 28px; | ||
+ | font-weight: bold; | ||
+ | } | ||
+ | |||
+ | .close:hover, | ||
+ | .close:focus { | ||
+ | color: black; | ||
+ | text-decoration: none; | ||
+ | cursor: pointer; | ||
+ | } | ||
</style> | </style> | ||
</head> | </head> |
Revision as of 12:08, 15 October 2016
Shubenacadie Microbiome Map
The Map
Our team was only able to obtain our samples due to our partnership with Shubenacadie wildlife park. Because of this, we have decided to how our appreciation by creating an interactive map detailing the animals’ microbiomes by geographical location at the park. To a general audience, the microbiome can be a very abstract concept since bacteria are rarely viewed as part of an internal ecosystem. This map is intended to make bacteria more tangible by letting people compare animals, their diets and their microbiomes. To use the map, hover over an animal habitat for a cursory look at their microbiome. For a more in-depth look and a brief description of the animal’s diet, click on the habitat for the complete biome.