/* Tooltip start */
span.tooltip {
	display: block;
	white-space: nowrap;
	position: absolute;
	left: 50%;
	padding: 0 10px;
	height: 30px;
	line-height: 20px;
	text-align: center;
	border-radius: 6px;
	z-index: 9999;
    -moz-animation-duration: 1s;
    -moz-animation-fill-mode: backwards;
    -moz-animation-delay: 0.5s;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: backwards;
    -webkit-animation-delay: 0.5s;
    animation-duration: 1s;
    animation-fill-mode: backwards;
    animation-delay: 0.5s;
}
span.tooltip.right {
	-moz-animation-name: bounce-right;
	-webkit-animation-name: bounce-right;
	animation-name :bounce-right;
}
span.tooltip.top {
	-moz-animation-name: bounce-top;
	-webkit-animation-name: bounce-top;
	animation-name: bounce-top;
}
span.tooltip.bottom {
	-moz-animation-name: bounce-bottom;
	-webkit-animation-name: bounce-bottom;
	animation-name: bounce-bottom;
}
span.tooltip.success {
    box-sizing: border-box;
	width: 34px;
	color: #FFFFFF;
	background: #7BD454 url('/National_Library/oe_/https://guardyoureyes.com/media/com_gyeuser/images/formSuccessIcon.svg') 10px 50% no-repeat;
}
span.tooltip.error {
	padding-left: 20px;
	color: #FFFFFF;
	background: #EC6A38 url('/National_Library/oe_/https://guardyoureyes.com/media/com_gyeuser/images/formErrorIcon.svg') 10px 50% no-repeat;
}
	span.tooltip:after {
		content: "";
		height: 0;
		position: absolute;
		width: 0;
	}
	span.tooltip.right:after {
		right: 100%;
		top: 12px;
	}
    span.tooltip.top:after,
    span.tooltip.bottom:after {
        left: 50%;
        margin-left: -5px;
    }
	span.tooltip.top:after {
		top: 100%;
	}
	span.tooltip.bottom:after {
		bottom: 100%;
	}
	span.tooltip.right:after {
		border-bottom: 5px solid transparent;
		border-top: 5px solid transparent;
	}
	span.tooltip.error.right:after {
		border-right: 5px solid #EC6A38;
	}
	span.tooltip.success.right:after {
		border-right: 5px solid #7BD454;
	}
	span.tooltip.top:after,
    span.tooltip.bottom:after {
		border-right: 5px solid transparent;
		border-left: 5px solid transparent;
	}
	span.tooltip.error.top:after {
		border-top: 5px solid #EC6A38;
	}
	span.tooltip.success.top:after {
		border-top: 5px solid #7BD454;
	}
	span.tooltip.error.bottom:after {
		border-bottom: 5px solid #EC6A38;
	}
	span.tooltip.success.bottom:after {
        border-bottom: 5px solid #7BD454;
	}

	.home-subscribe span.tooltip.top,
	.signup-form span.tooltip.top {
		padding: 5px 20px;
		max-width: 100vw;
		min-width: 250px;
		height: auto;
		white-space: initial;
	}

	@keyframes bounce-right {
		0% {
			opacity: 0;
			transform: translateX(0px);
		}
		55% {
			transform: translateX(10px);
		}
		65% {
			transform: translateX(-5px);
		}
		100% {
			opacity: 1;
			transform: translateX(0px);
		}
	}
	@-webkit-keyframes bounce-right {
		0% {
			opacity: 0;
			-webkit-transform: translateX(0px);
		}
		55% {
			-webkit-transform: translateX(10px);
		}
		65% {
			-webkit-transform: translateX(-5px);
		}
		100% {
			opacity: 1;
			-webkit-transform: translateX(0px);
		}
	}
	@-moz-keyframes bounce-right {
		0% {
			opacity: 0;
			-moz-transform: translateX(0px);
		}
		55% {
			-moz-transform: translateX(10px);
		}
		65% {
			-moz-transform: translateX(-5px);
		}
		100% {
			opacity: 1;
			-moz-transform: translateX(0px);
		}
	}/**/
	@keyframes bounce-top {
		0% {
			opacity: 0;
			transform: translateY(0px);
		}
		55% {
			transform: translateY(-5px);
		}
		65% {
			transform: translateY(10px);
		}
		100% {
			opacity: 1;
			transform: translateY(0px);
		}
	}
	@-webkit-keyframes bounce-top {
		0% {
			opacity: 0;
			-webkit-transform: translateY(0px);
		}
		55% {
			-webkit-transform: translateY(-5px);
		}
		65% {
			-webkit-transform: translateY(10px);
		}
		100% {
			opacity: 1;
			-webkit-transform: translateY(0px);
		}
	}
	@-moz-keyframes bounce-top {
		0% {
			opacity: 0;
			-moz-transform: translateY(0px);
		}
		55% {
			-moz-transform: translateY(-5px);
		}
		65% {
			-moz-transform: translateY(10px);
		}
		100% {
			opacity: 1;
			-moz-transform: translateY(0px);
		}
	}
	@keyframes bounce-bottom {
		0% {
			opacity: 0;
			transform: translateY(0px);
		}
		55% {
			transform: translateY(10px);
		}
		65% {
			transform: translateY(-5px);
		}
		100% {
			opacity: 1;
			transform: translateY(0px);
		}
	}
	@-webkit-keyframes bounce-bottom {
		0% {
			opacity: 0;
			-webkit-transform: translateY(0px);
		}
		55% {
			-webkit-transform: translateY(10px);
		}
		65% {
			-webkit-transform: translateY(-5px);
		}
		100% {
			opacity: 1;
			-webkit-transform: translateY(0px);
		}
	}
	@-moz-keyframes bounce-bottom {
		0% {
			opacity: 0;
			-moz-transform: translateY(0px);
		}
		55% {
			-moz-transform: translateY(10px);
		}
		65% {
			-moz-transform: translateY(-5px);
		}
		100% {
			opacity: 1;
			-moz-transform: translateY(0px);
		}
	}
/* Tooltip end */
