#shark-map {
	position: absolute;
	left: 9%;
	top: 13.6%;
	width: 82%;
}

#map {
	width: 77.5%;
	position: absolute;
	top: 87px;
	left: 220px;
	width: 100% !important;
	top: 0 !important;
	left: 0 !important;
}

#Red {
	position: absolute;
	width: 120%;
	top: -682px;
	left: -111px;
}

#star {
	pointer-events: none;
	position: absolute;
	width: 70%;
	left: 31.8%;
	/* top: 101%; */
	margin-top: 32px;
}

.answer-marker {
	height: 22px;
	margin: -7px 0 0 10px;
}

/* ---- Drone Markers ---- */
.data-point1 {
	stroke: var(--pink-color) !important;
	fill: var(--pink-color) !important;
	background-color: var(--pink-color) !important;
}
.data-point2 {
	stroke: var(--yellow-color) !important;
	fill: var(--yellow-color) !important;
	background-color: var(--yellow-color) !important;
}
.data-point3 {
	stroke: var(--blue-color) !important;
	fill: var(--blue-color) !important;
	background-color: var(--blue-color) !important;
}
.data-point4 {
	stroke: var(--purple-color) !important;
	fill: var(--purple-color) !important;
	background-color: var(--purple-color) !important;
}

/* ---- Markers ---- */
.outfall, .beach, .boat {
	position: absolute;
	width: 4.7%;
}

.outfall {
	top: 37%;
	left: 30.2%;
}

.beach {
	top: 65%;
	left: 16%;
}

.boat {
	top: 62%;
	left: 71%;
}

/* ---- Drop Zone ---- */
#drone {
	position: absolute;
	height: 30px;
/* 	margin-top: -25px; */
	margin-left: -20px;
	z-index: 1;
	pointer-events: none;
	display: none;
}

#drone-marker-holder .drone-marker { margin-left: 1.8em; }

.drone-marker {
	display: inline-block;
	width: 2em;
	height: 2em;
	font-size: 1.2em;
	line-height: 2em;
	border-radius: 50%;
	text-align: center;
	font-weight: bold;
	color: #ffffff;
	-webkit-box-shadow: 3px 3px 1px 1px #00000028;
	box-shadow: 3px 3px 1px 1px #00000028;
}

#drone-marker-holder {
	background: var(--violet-color);
	position: absolute;
	height: 9%;
	width: 26.1%;
	top: 17%;
	right: 12.6%;
	border-radius: 0.5em;
}

#drone-marker-holder p {
	color: #FFFFFF;
	font-weight: bold;
	text-align: center;
	font-size: 1.35em;
	text-transform: uppercase;
	margin-bottom: 0.25em;
}

#drone-zones {
	display: block;
	position: absolute;
	top: 17%;
	bottom: 20%;
	left: 17%;
	right: 11%;
}