.content-title {
	font-size: 30px;
	font-family: 'PrimaryFont';
	font-weight: lighter;
}

.content {
    flex: 3;
    padding: 0;
    box-sizing: border-box;
    overflow-y: hidden;
}

.title {
	text-align: center;
}

.form-login {
	display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
	background-position: center;
	background-size: 50%;
	background-repeat: no-repeat;
}

.login {

	display: flex;
	flex-direction: column;
	align-items: center;
    border: 1px solid maroon;
    border-radius: 10px;
    padding: 10px;
	text-align: center;
	font-family: 'PrimaryFont';
	font-weight: lighter;
	font-size: 26px;
	color: white;
	background-color: maroon;
}

.button-login {
	border: 1px solid maroon;
	border-radius: 15px;
	font-family: 'PrimaryFont';
	font-weight: lighter;
	font-size: 16px;
	transition: all .3s;
}

.button-login:active {
	background-color: #f00;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.8);
}

.divLogin {
	display: flex;
	max-width: 209px;
	background-color: white;
	height: 30px;
	border-radius: 15px;
	align-items: center;
	justify-content: center;
	margin-bottom: 20px;
}

.eye {
	/*filter: invert(99%) sepia(100%) saturate(17%) hue-rotate(213deg) brightness(104%) contrast(100%);/*blanco*/
	filter: brightness(0) saturate(100%) invert(11%) sepia(92%) saturate(745%) hue-rotate(-12deg) brightness(85%) contrast(83%);
	width: 20px;
	height: 20px;
	margin-right: 5px;
}

.input-login {
	border: none;
	text-align: center;
	outline: none;
	border-radius: 15px;
}

.h3-form {
	font-family: 'PrimaryFont';
	font-weight: lighter;
	font-size: 26px;
	text-align: center;
}

.msg-login {
    background-color: #fff;
	border-radius: 14px;
	font-family: 'PrimaryFont';
	font-weight: lighter;
	font-size: 16px;
	#msg_recived{
		margin: 10px;
		font-family: 'PrimaryFont';
		font-weight: lighter;
	}
	animation: msg-login-animation 12s;
	animation-iteration-count: 1; /* Hace que la animación se ejecute solo una vez */
    animation-fill-mode: forwards; /* Mantiene el estado final de la animación */
}

@keyframes msg-login-animation {
	0% {
		opacity: 0;
	}
    12% {
        opacity: 1;
    }
    75% {
        opacity: 1;
    }
	100% {
		opacity: 0;
	}
}