/* BASIC STYLING */
.e5-digicom-animation-container {
	position: relative;
	display: inline-block;
}

.e5-digicom-animation-container img {
	width: 100vw;
}

.e5-bubble-wrapper {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}

.e5-bubble {
	background-color: #E0A727;
	border-radius: 50%;
	width: 32px;
	height: 32px;
	position: absolute;
	cursor: pointer;
}

.e5-tooltip-wrapper {
	position: absolute;
	max-width: 33%;
	padding-left: 12px;
	padding-right: 12px;
	z-index: 999;
}

.e5-tooltip-text {
	background-color: #ffffff;
	border-color: #E0A727;
	border-width: 2px;
	border-top-width: 4px;
	border-right-width: 4px;
	border-style: solid;
	border-radius: 15px;
	padding-top: 12px;
	padding-bottom: 12px;
	padding-left: 12px;
	padding-right: 12px;
}

.e5-tooltip-text p {
	margin-top: 0;
	margin-bottom: 0;
}

.e5-tooltip-button {
	margin-top: 25px;
}

.e5-tooltip-button a,
.e5-tooltip-button a:link,
.e5-tooltip-button a:visited {
	background-color: #0083A5;
	border-radius: 10px;
	border: 2px solid #0083A5;
	color: #ffffff;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 32px;
	padding-right: 32px;
	text-decoration: none;
	font-weight: bold;
}

.e5-tooltip-button a:hover,
.e5-tooltip-button a:active {
	background-color: #ffffff;
	color: #0083A5;
}

/* RESPONSIVE */
.e5-animation-image-mobile {
	display: none;
}

@media screen and (max-width: 640px) {
	.e5-animation-image-desktop {
		display: none;
	}

	.e5-animation-image-mobile {
		display: block;
	}

	.e5-tooltip-wrapper {
		max-width: unset;
		pointer-events: none;
	}

	.e5-tooltip-button {
		pointer-events: all;
	}
}

/* ANIMATION  */
.e5-bubble {
	transition: transform 0.4s linear;
}

.e5-bubble:hover {
	transform: scale(1.3);
}

.e5-bubble.active {
	transform: scale(1.31);
}

.e5-tooltip-wrapper {
	display: none;
	opacity: 0;
	transition: opacity 0.2s linear;
}

.e5-tooltip-wrapper.active {
	opacity: 1;
}