* {
	font-family: 'Lato';
}

/* Elementi */
#main-container{
	transform: translate(0, 50%);
}

#title-container{
	display: flex;
	flex-direction: column;
}

#title{
	text-align: 	center;
	font-size:		36px;
	font-style:		italic;
	font-weight:	bold;
	margin-bottom: 	16px;
}

#title-description{
	text-align:	center;
	margin-bottom: 48px;
}

#login-container{
	max-width: 580px;
	min-width: 480px;
	
	margin: auto;

	background-color: lightskyblue;

	text-align: center;

	padding: 16px;
}

#input-company-psw{
	margin-left: 32px;
}

#btn-show-psw{
	border: none;
	background: none;
	opacity: 0.7;
	transition: all 0.2s;
}

#btn-show-psw:hover{
	opacity: 1;
}

#btn-login{
	width: 146px;
	height: 48px;

	margin-top: 36px;

	border-style:	solid;
	border-radius: 12px;
	text-transform:	uppercase;
	border-color:	cadetblue;
	margin-bottom: 8px;

	transition: all 0.2s;
}

#btn-login:hover{
	/* font-weight: bold; */
	background-color: lightgray;
}

/* Classi */
.login-text{
	font-weight:	bold;
	text-align:		center;
	font-size: 20px;
}

.input-login-text{
	font-size:		18px;
	letter-spacing: 0.6px;
	width: 320px;
}

.password-spacing{
	letter-spacing: 2px;
}

.btn-login-waiting{
	background-color: lightgray;
}

/* Web responsive */
@media screen and (max-width: 600px){
	#main-container{
		transform: translate(0, 10%);
	}

	#title{
		font-size: 44px;
	}

	#title-description{
		font-size: 24px;
		margin-bottom: 24px;
	}

	#login-container{
		max-width: 400px;
		min-width: 260px;
	}

	.input-login-text{
		width: 240px;
		font-size: 14px;
	}
}