@font-face {
    font-family: AvenirNext LT;
    src: url('../webfonts/AvenirNextLTPro-Regular.otf') format("opentype");
}

body {
	font-family: AvenirNext LT !important;
	background-color: #16171A !important;
	background-image: radial-gradient(1200px 600px at 30% -10%, rgba(108,155,255,.20), transparent 60%),
				  radial-gradient(900px 500px at 90% 0%, rgba(108,155,255,.12), transparent 55%);
	color: rgb(185, 185, 185);
}

/* Scope login-specific rules */
.login-page .container { align-content: center; }

.login-page .login-brand { margin-bottom: 8px; }
.login-page .login-logo {
	width: 240px;
	max-width: 80vw;
	height: auto;
}

.login-page .login-card {
	border-radius: 18px;
	max-width: 440px;
	background: rgba(32, 32, 32, 0.96) !important;
	border: 1px solid rgba(255,255,255,0.06);
	box-shadow: 0 18px 60px rgba(0,0,0,0.45);
}

.login-page .login-card .card-body {
	padding: 22px;
}

.login-page .login-copy { margin-bottom: 14px; }
.login-page .login-title {
	margin: 0 0 6px;
	color: #f9fafb;
	font-size: 22px;
	font-weight: 800;
	letter-spacing: .2px;
}
.login-page .login-subtitle {
	margin: 0;
	color: rgba(243,244,246,0.70);
	font-size: 13px;
	line-height: 1.35;
}
.login-page .login-help {
	margin-top: 10px;
	font-size: 12px;
	color: rgba(243,244,246,0.65);
}

.card-footer {
	background-color: rgb(52, 52, 57);
}

.card-footer a {
	color: #FFFFFF;
}

.social_icon span {
	font-size: 60px;
	margin-left: 10px;
	color: #6c9bff;
}

.social_icon span:hover {
	color: white;
	cursor: pointer;
}

.card-header h3 {
	color: white;
}

.social_icon {
	position: absolute;
	right: 20px;
	top: -45px;
}

.login-page .input-group-prepend span {
	width: 50px;
  border-radius: 13px;
	background-color: #6c9bff !important;
	color: white;
	border: 0 !important;
}

.login-page .form-control {
	border-radius: 0px 13px 13px 0px;
	background: rgba(255,255,255,0.06) !important;
	border: 1px solid rgba(255,255,255,0.10) !important;
	color: #f3f4f6 !important;
	height: 44px;
	padding: 10px 12px;
}

.login-page .form-control::placeholder {
	color: rgba(243,244,246,0.70);
}

.login-page .form-control:focus {
	border-color: rgba(108,155,255,0.9) !important;
	box-shadow: 0 0 0 3px rgba(108,155,255,0.25) !important;
}

input:focus {
	outline: 0 0 0 0 !important;
	box-shadow: 0 0 0 0 !important;
}

.remember {
	color: white;
}

.remember input {
	width: 20px;
	height: 20px;
	margin-left: 15px;
	margin-right: 5px;
}

.login_btn {
	color: white;
  border-radius: 13px;
	font-weight: 700;	
	background-color: #6c9bff !important;
	width: 100%;
	height: 44px;
	padding: 10px 14px;
}

.login_btn:hover {
	color: black;
	background-color: white;
}

.login-page .alert {
	border-radius: 12px;
	border: 1px solid rgba(255,255,255,0.10);
}

@media (max-width: 420px) {
	.login-page .login-card .card-body { padding: 18px; }
	.login-page .input-group-prepend span { width: 46px; }
}

.links {
	color: white;
	font-weight: 700;
}

.links a {
	margin-left: 4px;
}