div[id^=tool_]{
	position:relative;
	border:1px lightgray solid;
	border-radius:1em;
	width:8em;
	margin-left:2em;
	margin-top:1em;
	margin-bottom:1em;
	display:inline-block;
	overflow:visible;
}
div[id^=tool_]:hover{
	background:linear-gradient(#ead700 0%, #c9a500 100%);
	cursor:pointer;
}
div[id^=tool_] p{
	font-weight:bold;
	font-size:1.2em;
	text-align:center;
	margin-bottom:0;
}
div[id^=tool_] img{
	width:6em;
	display:block;
	margin: 0.3em auto 1em auto;
}
div[id^=tool_] .tooltipContainer{
	position:absolute;
	border-radius: 6px;
	padding:5px;
	z-index:1;
	background-color: black;
	text-align:center;
	width:auto;
	margin-top:5px;
	margin-left:5px;
	opacity: 0;
	visibility:hidden;
}
div[id^=tool_]:hover .tooltipContainer{
	opacity:1;
	visibility:visible;
	transition: opacity 1s linear 0.5s;
	-webkit-transition: opacity 1s linear 0.5s;
}
div[id^=tool_] .tooltipText{
	word-break: normal;
	color: #fff;
	text-align: left;
	font-size:0.7em;
	padding:0.3em;
}
div[id^=tool_] .tooltipText::after{
	content: "";
	position: absolute;
	bottom: 100%; /* At the bottom of the tooltip */
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: transparent transparent black transparent;
}
div[id^=tool_]:nth-child(3n+1) {background-color:#ececec;}
div[id^=tool_]:nth-child(3n+2) {background-color:#e1fbf3;}
div[id^=tool_]:nth-child(3n) {background-color:#d7ffd7;}
#qrcode_img{height: auto; width: auto; max-height: 97%; max-width: 97%; zoom: 5; margin-top: 0.8%;}
#qrcode_img:hover{cursor:pointer;}