@import url('https://fonts.googleapis.com/css?family=Nunito');

body {
	font-family: Nunito, sans-serif;
	background: linear-gradient(45deg, #28976A 10%,#CAFBE7 87%);
}

/* workaround for Chrome stupid forced styling on auto-fill */
input:-webkit-autofill {
    -webkit-box-shadow:0 0 0 50px white inset; /*0 0 0 50px #9F907B inset;*/
    -webkit-text-fill-color: #252525;
}
html{
    height:100%;
    min-height:100%;
}

.appLogo {
    position:relative;
    background: url(../images/LGPLogo.png) no-repeat center center;
    background-size: contain;
    margin-left:calc(100% - 550px);
    margin-top:5%;
    height:395px;
}
#login {
    max-width:260px;
    position:absolute;
    top:calc(50% - 85px);
    left:calc(50% - 140px);
}
.login{
    position: relative;
    height: 150px; 
    width: 100%;
    padding: 10px;
    z-index: 2;
    margin:auto;
}
.background {
    position: absolute;
    width: 360px;
    height: 235px;
    opacity: 1;
    background: white;
    margin: -50px;
    border-radius: 18px;
    z-index: -1;
    box-shadow: 5px 5px 10px 1px rgba(0,0,0,0.45);
}
.login input[type=text]{width: 250px;height: 30px;background: transparent;border: 1px solid rgba(162,162,162,0.6);border-radius: 2px;color: #252525;
    font-family: Nunito, sans-serif;font-size: 16px;font-weight: bold;padding: 4px;}

.login input[type=password]{width: 250px;height: 30px;background: transparent;border: 1px solid rgba(162,162,162,0.6);border-radius: 2px;color: #252525;
    font-family: Nunito, sans-serif;font-size: 16px;font-weight: bold;padding: 4px;margin-top: 10px;}

.login input[type=submit],
.login input[type=button]{width: 100%;height: 35px;background: #28976A;border: 1px solid #fff;cursor: pointer;border-radius: 2px;color: #d0d8de;
    font-family: Nunito, sans-serif;text-transform:uppercase;font-size: 16px;font-weight: 400;padding: 6px;margin-top: 10px;transition:all 0.5s ease}

.login input[type=submit]:hover,
.login input[type=button]:hover {background: #007847;color: #ffffff;border: 1px solid #D4D4D4;border-radius:5px;}
.login input[type=submit]:active,
.login input[type=button]:active{opacity: 1;}
.login input[type=text]:focus{outline: none;border: 1px solid #28976A;}
.login input[type=password]:focus{outline: none;border: 1px solid #28976A;}
.login input[type=submit]:focus,
.login input[type=button]:focus{outline: none;}

.login .links a {color:#d0d8de; font-family: 'lato', sans-serif; font-weight:bold; font-size:12px;text-decoration:none;padding-top: 5px;}
#forgot {
    max-width:260px;
    position:absolute;
    top:calc(50% - 75px);
    left:calc(50% - 140px);
}
@media (min-height:740px) {
    .footer{
        position: absolute;
        top: calc(99% - 10px);
        left: calc(50% - 350px);
        font-weight:300;
        font-family: lato, arial, sans-serif;
        font-size: 12px;
        color: #fff;
        width: 700px;
        text-align:center;
    }
}

@media (max-height:740px){
    .footer{
        position: relative;
        font-weight:300;
        font-family: lato, arial, sans-serif;
        font-size: 12px;
        color: #98cef5;
        width: 330px;
        text-align:center;
        margin:auto;
    }
}
.footer a {color:#fff;}