*{
    box-sizing:border-box
}
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline
}
html{
    font-size:62.5%;
    font-family:sans-serif
}
*{
    outline:none
}
body{
    font-size:1.5em;
    line-height:1.6;
    font-weight:400
}
address,b,h1,h2,h3,h4,h5,h6,header,input,li,strong,textarea{
    margin-top:0;
    margin-bottom:2rem;
    font-family:ScalaSansWebW03,sans-serif
}
h2{
    font-family:ScalaSansWebW03,sans-serif;
    font-weight:600;
    text-transform:capitalize;
    text-align:center;
    margin-top: 0;
    margin-bottom: 2rem;
    line-height: 1.25;
}
.login-page{
    position:relative;
    height:100vh;
    z-index:1
}
.login-page .login-wrapper{
    align-items:center;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding-top:15vh;
    position:relative;
    z-index:10
}
.login-page .login-wrapper>svg{
    height:50px;
    width:50px
}
.login-page .login-wrapper .logo-wrapper{
    width:166px;
    height:50px;
    margin:0 auto 25px;
    overflow:hidden
}
.login-page .login-wrapper .logo-wrapper img{
    float:right;
    width:20%;
    margin-bottom:25px;
    min-width:250px
}
.login-page .login-wrapper .signin-text{
    color:#fff;
    font-size:1.3rem;
    font-weight:300;
    min-width:420px;
    text-transform:none;
    width:100px
}
@media only screen and (max-width:440px){
    .login-page .login-wrapper .signin-text{
        min-width:0;
        width:100vw
    }
}
.login-page .login-wrapper form{
    margin:1rem 0
}
.login-page .login-wrapper .login-box{
    background:rgba(226,238,246,.8);
    border-radius:5px;
    display:block;
    margin-bottom:2rem;
    min-width:420px;
    padding:2rem;
    width:100px;
    position:relative
}
@media only screen and (max-width:440px){
    .login-page .login-wrapper .login-box{
        min-width:0;
        width:100vw
    }
}
.login-page .login-wrapper .login-box .login-fail-message{
    margin-bottom:2rem
}
.login-page .login-wrapper .login-box a{
    color:#64707a;
    cursor:pointer;
    font-size:1.6rem;
    text-decoration:none;
    transition:all .35s ease-in-out
}
@media only screen and (max-width:375px){
    .login-page .login-wrapper .login-box a{
        font-size:1.4rem
    }
}
@media only screen and (max-width:350px){
    .login-page .login-wrapper .login-box a{
        display:block;
        margin:1rem 0;
        text-align:center
    }
}
.login-page .login-wrapper .login-box a:hover{
    color:#318dde;
    transition:all .35s ease-in-out
}
.login-page .login-wrapper .login-box a:first-of-type{
    margin-right:2rem
}
@media only screen and (max-width:350px){
    .login-page .login-wrapper .login-box a:first-of-type{
        margin-right:0
    }
}
.login-page .login-wrapper .login-box input{
    display:block;
    font-size:1.6rem;
    width:100%
}
.login-page .login-wrapper .login-box input[type="checkbox"]{
    display:block;
    font-size:1.6rem;
	width: 16px;
	float: left;
}
.login-page .login-wrapper .login-box input:focus{
    border-color:#318dde
}
.login-page .login-wrapper .login-box button{
    background-color:#318dde;
    border-radius:5px;
    border:1px solid #318dde;
    color:#fff;
    cursor:pointer;
    display:block;
    font-family:ScalaSansWebW03,sans-serif;
    font-size:1.8rem;
    font-weight:300;
    margin-top:2rem;
    padding:1rem;
    position:relative;
    text-align:left;
    transition:all .35s ease-in-out;
    width:100%
}
.login-page .login-wrapper .login-box button:hover{
    background-color:#4aa3f2;
    border-color:#4aa3f2;
    transition:all .35s ease-in-out
}
.login-page .login-wrapper .login-box button svg{
    position:absolute;
    right:1.5rem;
    top:calc(50% - 8px)
}
.login-page .login-wrapper .login-box button svg .cls-1{
    fill:#fff
}
.login-page .login-wrapper .new-account{
    background:rgba(226,238,246,.8);
    border-radius:5px;
    display:block;
    padding:2rem 6rem 2rem 2rem;
    position:relative;
    text-decoration:none;
    transition:all .35s ease-in-out;
    width:100%;
    max-width:420px
}
.login-page .login-wrapper .new-account h3{
    color:#000;
    font-size:1.6rem;
    margin-bottom:0;
    text-decoration:none;
    width:80%;
    transition:all .3s ease
}
.login-page .login-wrapper .new-account h3 br{
    display:none
}
.login-page .login-wrapper .new-account h3 svg{
    right:1rem;
    position:absolute;
    top:calc(50% - 11px)
}
.login-page .login-wrapper .new-account:hover{
    background:#fff
}
.login-page .login-wrapper .new-account:hover h3{
    color:#318dde
}
.login-page .login-overlay{
    background:linear-gradient(rgba(69,133,194,.5),rgba(69,133,194,.5));
    height:100%;
    left:0;
    position:absolute;
    top:0;
    width:100%;
    z-index:5
}
input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],select,textarea{
    font-family:ScalaSansWebW03,sans-serif;
    padding:6px 10px;
    font-size:1.5rem;
    background-color:#fff;
    border:1px solid #d1d1d1;
    border-radius:4px;
    box-shadow:none;
    box-sizing:border-box
}
input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],textarea{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none
}
.login-page .login-wrapper .new-account h3{
    color:#000;
    font-size:1.6rem;
    margin-bottom:0;
    text-decoration:none;
    width:80%;
    transition:all .3s ease
}
a{
    font-family:ScalaSansWebW03,sans-serif;
    color:#318dde;
    cursor:pointer;
    text-decoration:none
}
a,a:hover{
    color:#00f
}