:root{
	--color-fondo: black;
	--color-fondo-loging: white;
	--color-h1: rgb(128, 128, 128);
	--color-border-input: rgb(190, 190, 190);
	--color-alert-confir: rgb(34, 139, 34);
	--danger: rgb(215, 80, 80);
	--success: rgb(50, 160, 100);
	}

html,
body{
	margin: 0;
	padding: 0;
}

body{
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	min-height: 100vh;
	background: var(--color-fondo);
}

.login{
	display: flex;
	flex-flow: column;
	background: white;
	margin: auto;
	align-items: center;
	border: 5px solid green;
	

/*	min-width: 10rem;*/
	/*width: 15rem;
	height: 10rem;*/
	border-radius: 15px;
	overflow: auto ;

}
.login__img{
	height: 13rem;
	padding: 1rem;
}
.login__titulo{
	text-align: center;
	font-size: 1.5em;
	font-weight: bold;
	color: var(--color-h1);
	margin-bottom: 0;
}

.form{
}
.form__input{
	 max-width: 250px;
	 height: 30px;
	 margin: 2px;
	 border-style: solid;
	 border-color: var(--color-border-input);
	 border-radius: 5px;
	 font-size: 1em;
	 padding-left: 10px;
	 outline: 0;
}
.form__input--focus:focus{
	border: 2px solid rgb(34, 139, 34);
}

.btn{
	background: rgb(0, 128, 0);
	padding:  0.375rem 0.75rem;
	font-weight: 400;
	line-height: 1.5;
	border-width: 1px;
	border-color: transparent;
	border-radius: 0.375rem;
	font-size: 1rem;
	display: inline-block;
	cursor: pointer;
	color: white;
	transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	margin-top: 5px;
}
.btn:hover{
	background: rgb(0, 100, 0);

}
.btn--fluid{
	width: 100%;
}
.btn--regis{
	background: rgb(13, 100, 253);
	padding:  0.100rem 0.25rem;
	font-weight: 200;
	line-height: 1;
	border-width: 1px;
	font-size: 1rem;
	align-items: center;
}
.btn--regis:hover{
	background: rgb(13, 80, 253);
}


.version{
	padding: 1rem;
	font-weight: bold;
	font-size: 18px;
	text-align: center;
}
.alert{
	
	line-height: 2.5rem;
	width: 100%;
	text-align: center;
	font-size: 20px;
	color: white;
}
.alert--danger{
	background: var(--danger);
	color: white;
}
.alert--success{
	background: var(--success);
	color: white;
}
@media screen and (max-width: 500px){
	.login{
		width: 100%;
		border-radius: 0;
		border:0 ;
		border-top: 5px solid green;
		border-bottom: 5px solid green;

	}
	.login__img{
		max-height: 8rem;
	}
}