/* connectorHotspotImage.html */
	
	#panel.right {
		float:	right;
		margin:	0 0 20px 20px;
	}
	
	#panel.left {
		float:	left;
		margin:	0 20px 20px 0;
	}
	
	#imageHolder {
		position:	relative;
	}
	
	#pageContents .hotspot {
		position:	absolute;
		cursor:		pointer;
	}
	
	#pageContents .highlightBorder {
		border:		1px solid;
		margin-top: -1px;
		margin-left: -1px;
	}
	
	#pageContents .selected {
		border:		2px solid;
		margin-top: -2px;
		margin-left: -2px;
	}

	#pageContents .hotspot.transparent.selected {
		border:		0px solid;
	}

	#feedback {
		text-align:	center;
	}
	
	#audioHolder {
		display: none;
	}

	div.hotspotIconHolder {
	transform: translate(-50%, -50%);
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 32;
	}

	span.hotspotIcon {
	z-index: 33;
	border-style: solid;
	cursor: pointer;
	border-radius: 50%;
	box-sizing: border-box;
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	}

	span.hotspotIcon.selected {
		z-index: 36;
		height: 110%;
		width: 110%;
	}

	div.hotspot_bubble {
	z-index: 34;
	position: fixed;
		overflow-y: auto;
		word-wrap: break-word;
	background: white;
		border-radius: 10px;
		border-color: black;
		border-width: 1px;
		border-style: solid;
		padding: 8px;
	}