.wra-floating-button {
	position: fixed;
	bottom: 20px;
	z-index: 999999;

	width: 64px;
	height: 64px;

	background: transparent;
	
    display: flex;
	align-items: center;
	justify-content: center;

	text-decoration: none;
	color: #ffffff;

	overflow: visible;
}

.wra-position-right {
	right: 20px;
}

.wra-position-left {
	left: 20px;
}

.wra-icon {
	width: 64px;
	height: 64px;

	display: block;

	object-fit: contain;

	flex-shrink: 0;

	filter: drop-shadow(0 4px 10px rgba(0,0,0,.25));
}

.wra-icon path {
	fill: #ffffff;
}

.wra-tooltip {
	position: absolute;
	top: 50%;

	transform: translateY(-50%);

	background: #ffffff;
	color: #333333;

	padding: 10px 14px;

	border-radius: 8px;

	font-size: 14px;
	font-weight: 500;

	white-space: nowrap;

	box-shadow: 0 2px 10px rgba(0,0,0,.15);

	opacity: 0;

	transition:
		opacity .25s ease,
		transform .25s ease;

	pointer-events: none;
}

.wra-position-right .wra-tooltip {
	right: 80px;
	transform: translateY(-50%) translateX(10px);
}

.wra-position-left .wra-tooltip {
	left: 80px;
	transform: translateY(-50%) translateX(-10px);
}

.wra-floating-button:hover .wra-tooltip {
	opacity: 1;
}

.wra-position-right:hover .wra-tooltip {
	transform: translateY(-50%) translateX(0);
}

.wra-position-left:hover .wra-tooltip {
	transform: translateY(-50%) translateX(0);
}

@media (max-width: 768px) {

	.wra-tooltip {
		display: none;
	}
}

.wra-hidden {
	display: none !important;
}