.click-container {
	position: absolute;
	border-radius: 100%;
}

#dots-oil-slick  { width: 103px; height: 97px; top: 263px; right: 399px; }
#dots-oil-slick2 { width: 103px; height: 90px; top: 269px; right: 398px; }

#dots-plastic-litter,
#dots-plastic-litter2 { width: 185px; height: 106px; bottom: 6px; right: 10px; }

#dots-noswim-nofish,
#dots-noswim-nofish2  { width: 94px; height: 200px; top: 32px; left: 8px; }

#dots-outfall  { width: 156px; height: 164px; top: 76px; left: 145px; }
#dots-outfall2 { width: 155px; height: 123px; top: 134px; left: 132px; }

#dots-fewplants-animals  { width: 201px; height: 163px; top: 89px; left: 302px; }
#dots-fewplants-animals2 { width: 218px; height: 163px; top: 89px; left: 286px; }

.clicked {
	border: 3px solid #F4CA5E;
	-webkit-box-shadow: 0 0 0 rgba(204,169,44, 0.4);
	box-shadow: 0 0 0 rgba(204,169,44, 0.4);
	animation: pulse 2s infinite;
}

@keyframes pulse {
	0% {
		-webkit-box-shadow: 0 0 0 0 rgba(204, 169%, 44%, 80%);
		-moz-box-shadow: 0 0 0 0 rgba(204, 169%, 44%, 80%);
		box-shadow: 0 0 0 0 rgba(204, 169%, 44%, 80%)
	}

	70% {
		-webkit-box-shadow: 0 0 0 10px rgba(204, 169%, 44%, 1%);
		-moz-box-shadow: 0 0 0 10px rgba(204, 169%, 44%, 1%);
		box-shadow: 0 0 0 10px rgba(204, 169%, 44%, 1%)
	}

	100% {
		-webkit-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
		-moz-box-shadow: 0 0 0 0 rgba(204, 169, 44, 0);
		box-shadow: 0 0 0 0 rgba(204, 169, 44, 0)
	}
}

.bottom-box-title {
	font-weight: 600;
	text-align: left;
	margin-left: 17px
}

.bottom-box-result {
	list-style-type: none;
	padding-left: 10px;
	margin-top: 7px
}

.bottom-box-result li {
	text-align: left;
	padding: 0.2em;
	display: none
}

#left-box,
#right-box {
	top: 55%;
	height: 39%
}

#left-box {
	left: 9%;
	width: 29% !important
}

#right-box {
	left: 39%;
	width: 55%;
	display: none
}

#right-box p { text-align: left }

#right-box textarea { height: 68% !important; }

#right-box p { height: 100% }

#right-box textarea { height: 93% }

.green-box { line-height: 1.1em }

#page-1 {
	left: 9%;
	width: 82%;
	top: 2%
}

#before-image,
#after-image  {
	position: absolute;
	top: 14.2%
}

#before-image { left: 9% }
#after-image  { right: 9% }

.contents {
	border: 6px solid #fff;
	border-radius: 5px;
	width: 510px;
	height: 370px;
	overflow: hidden
}

.contents>img {
	object-fit: cover;
	width: 100%;
	height: 100%
}

.selector-holder {
	width: 445px;
	font-size: 0.9em;
}