﻿@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap');
   /*--------------------New Login form Css-----------------*/
body{font-family:'Manrope', sans-serif; font-weight:500;}
.btn { box-shadow: none !important; outline: none !important; color: #FFF; text-transform: uppercase; font-size: 14px; line-height: 18px; padding: 15px 38px; transition: all 0.2s ease-in-out; letter-spacing: 1px; border: 0; margin-bottom: 0; }
.btn-primary { background: #5A78FF !important; margin-bottom: 32px;}
.btn-primary:hover { background: #3854d2 !important; }

.form-group-with-label{ margin-bottom: 40px; }
.form-group-with-label label{ display: block; text-align: left; font-family:'Manrope', sans-serif;font-weight:500;font-size: 18px;line-height: 22px; margin-bottom: 16px; color:#44566C;}
.form-group-with-label .form-control{ height: 48px; padding: 16px; font-family:'Manrope', sans-serif; font-weight:400;font-size: 16px;line-height: 20px; opacity: 0.5; box-shadow: none!important; outline: none!important; transition: all 0.2s ease-in-out;background: #FFFFFF;	border: 1px solid #E1E5E9;	box-sizing: border-box;	border-radius: 4px; }
.form-group-with-label .form-control:focus, .form-group-with-label .form-control:active{ border-color: rgba(68, 86, 108, 0.5); opacity: 1; }

/* Main Content
--------------------------------------------------------------------------------------------------------*/
.login-wrapper { min-height: 100vh; width: 100%; }
.login-wrapper .login-outer {display: flex; justify-content: center;align-items: flex-start; min-height: 100vh; padding: 80px 15px 15px;}
.login-outer .login-form { background: #FFFFFF;border-radius: 12px; width: 640px; text-align: center; padding: 64px 56px 58px; }
.login-outer .login-form.forget-password-form{ padding: 64px 56px 40px; }
.login-outer .login-form .logo{ display: inline-block; vertical-align: middle; margin-bottom: 56px; }
.login-outer .login-form .logo img{ display: inline-block; vertical-align: middle; width: 200px; height: 53px; }
.login-outer .login-form h3{ font-family:'Manrope', sans-serif;font-weight:500;font-size: 32px;line-height: 36px; color: #44566c; padding-bottom: 26px; }
.login-outer .login-form .help-links a{ display: inline-block; vertical-align: middle; margin-right: 5px; font-family:'Manrope', sans-serif;font-weight:500;font-size: 20px;line-height: 24px; color: #979797}
.login-outer .login-form .help-links a:last-child{ margin-right: 0; }
.login-outer .login-form .help-links a:last-child:hover{ color: #5f5959; }
.login-outer .login-form .help-links a>img{ display: inline-block; vertical-align: middle; width: 30px; height: 30px; }

.login-form{max-width:inherit;}
.logo{float:none;}

/* Responsive Media Queries
--------------------------------------------------------------------------------------------------------*/
@media (max-width:1199px) { }
@media (max-width:991px) { 
	.login-wrapper .login-outer{ padding: 50px 15px; }
	.login-outer .login-form, .login-outer .login-form.forget-password-form{ padding: 45px 25px; }
	.login-outer .login-form .logo{ margin-bottom: 25px; }
	.login-outer .login-form h3{ padding-bottom: 35px; }
	.form-group-with-label{ margin-bottom: 25px; }
	.form-group-with-label label{ margin-bottom: 10px; }
}
@media (max-width:767px) {
	.login-outer .login-form {	width: 100%;}
	.login-outer .login-form, .login-outer .login-form.forget-password-form{ padding: 25px 15px; }
	.login-outer .login-form h3{ font-size: 28px; line-height: 32px; }
	.form-group-with-label label{ font-size: 16px; line-height: 20px; }
	.form-group-with-label .form-control{ font-size: 14px; line-height: 18px; height: 44px; padding: 16px; }
	.form-group-with-label{ margin-bottom: 14px; }
	.login-outer .login-form .help-links a{ font-size: 16px; line-height: 20px; }
	.btn-primary{ margin-bottom: 20px; margin-top: 10px; }
}
@media (max-width:575px) { }
