body{
	background: url(../images/lasalle_bg.png) -500px -100px no-repeat #f6f6f6;
	background-size: 1200px auto;
	height: 100vh;
}
#login_wrapper{
	margin: 0 auto;
	max-width: 900px;
	width: 100%;
}
p{
	font-size: 22px;
	text-align: center;
}
#frmLogin{
	background: #fafafa;
	border-radius: 5px;
	box-shadow: 0 5px 10px rgba(0,0,0,.5);
	margin: 0 auto 40px auto;
	padding: 20px;
	width: 380px;
}
#frmLogin label,
#frmLogin input[type="text"],
#frmLogin input[type="password"]{
	border: none;
	display: block;
	margin-bottom: 5px;
	padding: 3px;
	width: 100%;
}
#frmLogin button{
	background: #3B62A9;
	border: none;
	border-radius: 5px;
	color: #fff;
	padding: 5px;
	width: 100%;
}
#login_felino{
	background: url(../images/felino_mobil.png) center no-repeat;
	background-size: auto 100%;
	height: 400px;
	margin: 0 auto;
	width: 300px;
}
#login_tips span {
    color: #9E1C36;
}
#saving{
	background: rgba(255,255,255,.7);
	display: none;
	height: 100vh;
	position: fixed;
	top: 0;
	width: 100vw;
	z-index: 50;
}
#saving #logo{
	animation: loading 2s linear infinite;
	background: url(../images/loader_lasalle.png);
	background-size: cover;
	height: 100px;
	margin: calc(50vh - 50px) auto;
	width: 100px;
}
@keyframes loading{
	0% {transform: rotate(0deg);}
	50% {transform: rotate(180deg);}
	100% {transform: rotate(360deg);}
}

@media screen and (min-width: 768px){
	#login_felino{
		background-image: url(../images/felino_tablet.png);
	}
}
@media screen and (min-width: 960px){
	#frmLogin{
		float: right;
	}
	#login_felino{
		background-image: url(../images/felino_desktop.png);
		float: left;
		width: 50%;
	}
}