body.login{
    background-image: url('/wp-content/plugins/tka-course/assets/login/login-background.png');
    background-size: cover;
    height: 100vh;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    position: relative;
}

#login h1 a {
    background-image: url('/wp-content/plugins/tka-course/assets/login/small-logo.png');
    background-repeat: no-repeat;
    width: auto !important;
    background-size: contain;
}

#login h1 a:focus{
    box-shadow: none !important;
}

#loginform{
    box-shadow: 2px 8px 14px rgb(103 174 254);
    border-radius: 6px;
    border: 0px;
    margin-bottom: 30px;
}

#loginform label{
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 8px;
}

#loginform input[type='checkbox'] + label{
    font-weight: 400;
    font-size: 14px;
}

#loginform input[type='text'], #loginform input[type='password'], #loginform input[type='email'], #loginform input[type='checkbox']{
	line-height: 1.5;
	border-radius: 3px;
	background-color: #fff;
	background-clip: padding-box;
	border: 1px solid #ced4da;
	transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
	outline-offset: -2px;
	-webkit-appearance: none;
	font-size: 15px;
	font-family: inherit;
}

#loginform input[type='text'], #loginform input[type='password'], #loginform input[type='email']{
    height: 40px;
}

#loginform input[type='text']:focus, #loginform input[type='password']:focus, #loginform input[type='email']:focus, #loginform input[type='checkbox']:focus{
	color: #495057;
	background-color: #fff;
	border-color: #80bdff;
	outline: 0;
	box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
}

#loginform input[type='submit']{
    color: white;
	background-color: #0095ff;
	box-shadow: rgb(255 255 255 / 40%) 0 1px 0 0 inset;
}

#loginform input[type='submit']:hover{
    background-color: #07c;
	border-color: transparent;
}

#loginform input[type='submit']:focus, #loginform input[type='submit']:active{
    box-shadow: 0 0 0 0.2rem rgb(0 123 255 / 25%);
	border-color: transparent;
}

@media only screen and (max-width: 768px) {
    body.login{
        background-image: none;
    }

    #login{
        margin-top: 6% !important;
    }
    
    #loginform{
        margin: 10px 15px;
    }
}