.green-box {
	left: 9%;
	top: 2%;
	width: 82%;
	height: 13.4%;
	line-height: 1.1em;
	letter-spacing: 0;
}

.solid-light-purple-box {
	position: fixed;
	top: 33%;
	width: 76%;
	left: 12%;
}

.green-box p { padding-top: 0.6em; }

.solid-blue-box {
	box-shadow: 5px 5px 2px 2px #00000028;
	border-top: 2px outset #402F4C80;
	border-left: 1px outset #402F4C80;
	border-bottom: 1px outset #402F4C80;
	letter-spacing: 0.3px;
}

#page-1 {
	position: absolute;
	left: 9%;
    top: 18%;
    width: 82%;
    height: 78%;
	display: flex;
	justify-content: flex-start;
	flex-direction: row;
}

.image-box {
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	align-items: center;
	width: 32%;
	margin: 0 0 0 2%;
	background-color: rgba(101,165,192,.65);
}

.image-box div {
	display: none;
	flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
	height: 14%;
	color:#fff;
	gap: 5%;
}

.image-box p {
	font-size: 1.3em;
	margin: 0;
}

.image-box div img{
	max-width:100%;
	max-height:100%;
	margin: 0;
}

.neighborhood-container {
	z-index: 0;
}

.click-difference-container {
	overflow:hidden;
}

.top-image #grass-circle {
    left: 41%;
    top: 46%;
}

.bottom-image #grass-circle {
    left: 41%;
    top: 85%;
}

.top-image #paint-circle {
    left: 10%;
    top: 38%;
}

.bottom-image #paint-circle {
    left: 10%;
    top: 78%;
}

.top-image #bus-circle {
	left: 39%;
    top: 34%;
}

.bottom-image #bus-circle {
	left: 39%;
    top: 74%;
}

.top-image #tree-circle {
    left: 16%;
    top: 26%;
}

.bottom-image #tree-circle {
    left: 16%;
    top: 66%;
}

.top-image #tree-circle:nth-last-child(6) {
	left: 35%;
    top: 26%;
}

.bottom-image #tree-circle:nth-last-child(6) {
    left: 35%;
    top: 66%;
}

.top-image #tree-circle:nth-last-child(5) {
    left: 53%;
    top: 26%;
}

.bottom-image #tree-circle:nth-last-child(5) {
    left: 53%;
    top: 66%;
}

.top-image #barrel-circle {
	left: 41%;
    top: 26%;
}

.bottom-image #barrel-circle {
	left: 41%;
    top: 66%;
}

.top-image #transport-circle {
	left: 45.5%;
    top: 26%;
}

.top-image #transport-circle:nth-last-child(2) {
    left: 10.5%;
    top: 35%;
    width: 380px;
    height: 35px;
}

.bottom-image #transport-circle {
	left: 45.5%;
    top: 66%;
}

.bottom-image #transport-circle:nth-last-child(2) {
    left: 10.5%;
    top: 74.8%;
    width: 380px;
    height: 35px;
}


.top-image #garden-circle {
	left: 23%;
    top: 16%;
}

.bottom-image #garden-circle {
	left: 23%;
    top: 56%;
}


#grass-circle {
    position: absolute;
    width: 290px;
    height: 100px;
    border-radius: 50%;
}

#paint-circle {
    position: absolute;
    width: 400px;
    height: 120px;
    border-radius: 50%;
}

#bus-circle {
    position: absolute;
    width: 250px;
    height: 90px;
    border-radius: 50%;
}

#tree-circle {
    position: absolute;
    width: 70px;
    height: 90px;
    border-radius: 50%;
}

#barrel-circle {
    position: absolute;
    width: 50px;
    height: 60px;
    border-radius: 50%;
}

#transport-circle {
    position: absolute;
    width: 100px;
    height: 80px;
    border-radius: 50%;
}

#garden-circle {
    position: absolute;
    width: 110px;
    height: 50px;
    border-radius: 50%;
}

.difference-marker {
	position: absolute;
    margin:10px 0 0 -10px;
    -moz-border-radius: 100px / 50px;
    -webkit-border-radius: 100px / 50px;
    border-radius: 100px / 50px;
	border: none;
}

.neighborhood-container {
	position: relative;
    border: 5px solid #fff;
    border-radius: 0.5em;
	height: 50%;
}

.neighborhood-box {
	display: flex;
	flex-direction: column;
    width: 65%;
    height: 100%;
	gap: 1%;
}

.neighborhood-schoolbuilding {
    z-index: 2;
}

.neighborhood-box .neighborhood-container:first-child .neighborhood-schoolbuildingreflectiveroof, .neighborhood-box .neighborhood-container:first-child .neighborhood-flood, .neighborhood-box .neighborhood-container:first-child .neighborhood-streetbikelane, .neighborhood-box .neighborhood-container:first-child .neighborhood-streettreetwo, .neighborhood-box .neighborhood-container:first-child .neighborhood-streettree, .neighborhood-box .neighborhood-container:first-child .neighborhood-streettreethree, .neighborhood-box .neighborhood-container:first-child .neighborhood-busstop, .neighborhood-box .neighborhood-container:first-child .neighborhood-noidlingsign, .neighborhood-box .neighborhood-container:first-child .neighborhood-roofgarden, .neighborhood-box .neighborhood-container:first-child .neighborhood-rainbarrel {
	visibility: hidden;
}

.neighborhood-flood, .neighborhood-busexhaust {
	visibility: hidden;
}

.neighborhood-box .neighborhood-container:last-child .neighborhood-blacktop {
	visibility: hidden;
}