

.alert{
	position: relative;
	width: 100%;
	margin: 1px;
	padding-top: 10px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 10px;
	border: 1px solid Black;
	border-radius: 0.25rem;
	color: #f7f7f7;
	background-color: #fd0808;
	/* animation: fadeInAndOut 3.4s ease-in-out forwards;*/
}

.confirmation{
	position: relative;
	width: 100%;
	margin: 1px;
	padding-top: 10px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 10px;
	border: 1px solid Black;
	border-radius: 0.25rem;
	color: #155724;
	background-color: #d4edda;
	animation: fadeInAndOut 3.4s ease-in-out forwards;
}

.information{
	position: relative;
	width: 100%;
	margin: 1px;
	margin-bottom: 10px;
	padding-top: 10px;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 10px;
	border: 1px solid Black;
	border-radius: 0.25rem;
	color: Black;
	background-color: #d5d5d5;
	/* animation: fadeInAndOut 3.4s ease-in-out forwards;*/
}

@keyframes fadeIn {
    0% { opacity:0;}
    100% { opacity:1;}
}

@keyframes fadeInAndOut {
    0% { opacity: 0; } /* Start transparent */
    12% { opacity: 1; } /* Fade in over 0.4s (12% of 3.4s) */
    88% { opacity: 1; } /* Hold for 2.6s (76% of 3.4s) */
    100% { opacity: 0; } /* Fade out over 0.4s (12% of 3.4s) */
}