@font-face {
	font-family: 'Source Sans';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('login-fonts/source-sans-pro/SourceSansPro-Regular.woff2') format('woff2');
}

@font-face {
	font-family: 'Source Sans';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('login-fonts/source-sans-pro/SourceSansPro-SemiBold.woff2') format('woff2');
}

@font-face {
	font-family: 'Gotham Rounded';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('login-fonts/gotham/GothamRounded-Book.woff2') format('woff2');
}

@font-face {
	font-family: 'Gotham Rounded';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('login-fonts/gotham/GothamRounded-Medium.woff2') format('woff2');
}

body.login-page .branded-login-shell {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: min(1100px, calc(100vw - 64px));
	margin: 70px auto 0;
}

body.login-page #login-form.branded-login {
	display: grid !important;
	grid-template-columns: 52% 48%;
	width: 100% !important;
	height: auto !important;
	min-height: 318px;
	margin: 0 !important;
	background: #fff;
	border-radius: 15px !important;
	overflow: hidden;
	box-shadow: none;
}

body.login-page #login-form.branded-login.branded-login-without-banner {
	display: block !important;
	width: min(400px, calc(100vw - 40px)) !important;
	min-height: 0;
}

body.login-page #login-form.branded-login .branded-login-panel {
	display: flex;
	flex-direction: column;
	min-width: 0;
	padding: 58px 36px 30px;
	background: #fff;
}

body.login-page #login-form.branded-login form {
	background: #fff !important;
}

body.login-page #login-form.branded-login .branded-login-title {
	position: static;
	top: auto;
	left: auto;
	width: auto;
	height: auto;
	display: flex !important;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
	padding: 0;
	text-indent: 0;
	overflow: visible;
	color: #111;
	background: #fff !important;
	border: 0;
	border-radius: 0;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.2;
}

body.login-page #login-form.branded-login .branded-login-title-icon {
	display: block;
	flex: 0 0 52px;
	width: 52px;
	height: 52px;
	background: url('login-banners/shared/webmail-icon.svg') center / 52px 52px no-repeat;
}

body.login-page #login-form.branded-login.branded-login-lcn .branded-login-title-icon {
	background-image: url('login-banners/lcn/webmail-icon.svg');
}

body.login-page #login-form.branded-login.branded-login-lcn,
body.login-page #login-form.branded-login.branded-login-lcn input,
body.login-page #login-form.branded-login.branded-login-lcn button {
	font-family: 'Source Sans', sans-serif;
}

body.login-page #login-form.branded-login.branded-login-lcn .branded-login-title,
body.login-page #login-form.branded-login.branded-login-lcn #rcmloginsubmit {
	font-family: 'Gotham Rounded', sans-serif;
}

body.login-page #login-form.branded-login #logo,
body.login-page #login-form.branded-login #company-name,
body.login-page #login-form.branded-login .box-inner > h1:not(.branded-login-title) {
	display: none !important;
}

body.login-page .branded-login-brand-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	margin: 20px 0 60px;
}

body.login-page .branded-login-brand-logo img {
	display: block;
	width: auto;
	height: auto;
	max-width: 150px;
	max-height: 36px;
}

body.login-page #login-form.branded-login.branded-login-lcn ~ .branded-login-brand-logo img {
	max-width: 60px;
	max-height: 48px;
}

body.login-page #login-form.branded-login .box-inner,
body.login-page #login-form.branded-login .box-bottom,
body.login-page #login-form.branded-login #bottomline {
	position: static !important;
	width: auto !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-sizing: border-box;
}

body.login-page #login-form.branded-login #message {
	min-height: 0 !important;
	padding: 0 !important;
}

body.login-page #login-form.branded-login #message > div,
body.login-page #login-form.branded-login .noscriptwarning {
	margin-top: 18px;
}

body.login-page #login-form.branded-login #message > div {
	width: 100%;
	box-sizing: border-box;
	padding: 12px 14px !important;
	border: 1px solid #d9e0e7;
	border-radius: 6px !important;
	color: #344054;
	background: #f8fafc !important;
	font-size: 14px;
	line-height: 1.4;
	text-align: left;
	white-space: normal;
	overflow-wrap: anywhere;
}

body.login-page #login-form.branded-login #message > div.error {
	color: #b42318;
	border-color: #f4c7c3;
	background: #fff4f2 !important;
}

body.login-page #login-form.branded-login #message > div.warning {
	color: #b54708;
	border-color: #f9d9a6;
	background: #fff8e7 !important;
}

body.login-page #login-form.branded-login #message > div.confirmation {
	color: #067647;
	border-color: #abefc6;
	background: #ecfdf3 !important;
}

body.login-page #login-form.branded-login #bottomline {
	visibility: visible !important;
	margin-top: auto !important;
	padding-top: 24px !important;
}

body.login-page #login-form.branded-login .support-link,
body.login-page #login-form.branded-login a[href*="_action=pwreset"] {
	color: #2668c6 !important;
	font-size: 14px !important;
	text-decoration: underline !important;
}

body.login-page #login-form.branded-login .support-link {
	display: inline-block !important;
	visibility: visible !important;
}

body.login-page #login-form.branded-login td.login-links {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	box-sizing: border-box;
}

body.login-page #login-form.branded-login td.login-links .support-link {
	margin-left: auto;
}

body.login-page #login-form.branded-login td.title label,
body.login-page #login-form.branded-login td.input input {
	font-size: 16px;
}

body.login-page #login-form.branded-login td.input input {
	box-sizing: border-box;
	width: 100%;
	padding: 12px 14px;
	border: 2px solid #e6e6e6 !important;
	border-radius: 5px !important;
}

body.login-page #login-form.branded-login td.input input:focus {
	border-color: #2668c6 !important;
	outline: 2px solid rgba(38, 104, 198, 0.25);
	outline-offset: 1px;
}

body.login-page #login-form.branded-login #rcmloginsubmit {
	padding: 12px 30px !important;
	color: #fff;
	background: #2668c6 !important;
	border-color: #2668c6 !important;
	border-radius: 5px !important;
	font-size: 16px;
	font-weight: 600;
}

body.login-page #login-form.branded-login #rcmloginsubmit:hover {
	background: #1f56a3 !important;
	border-color: #1f56a3 !important;
}

body.login-page #login-form.branded-login.branded-login-lcn #rcmloginsubmit {
	background: #ba005a !important;
	border-color: #ba005a !important;
	border-bottom: 0 !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	text-transform: none !important;
}

body.login-page #login-form.branded-login.branded-login-lcn #rcmloginsubmit:hover {
	background: #8a0f4f !important;
	border-color: #8a0f4f !important;
}

body.login-page #login-form.branded-login .branded-login-banner {
	display: flex;
	align-items: center;
	min-width: 0;
	padding: 36px 42px 36px 0;
	background: #fff;
	box-sizing: border-box;
}

body.login-page #login-form.branded-login .login-banner {
	width: 100%;
	aspect-ratio: 1864 / 1440;
	padding: 10px;
	border: 2px solid #e6e6e6;
	border-radius: 8px !important;
	background: #fff;
	box-sizing: border-box;
	overflow: hidden;
}

body.login-page #login-form.branded-login .login-banner a,
body.login-page #login-form.branded-login .login-banner picture {
	display: block;
	width: 100%;
	height: 100%;
}

body.login-page #login-form.branded-login .login-banner img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 899px) {
	body.login-page #login-form.branded-login,
	body.login-page #login-form.branded-login.branded-login-without-banner {
		display: flex !important;
		flex-direction: column;
		width: 100% !important;
		min-height: 0;
	}

	body.login-page #login-form.branded-login #rcmloginsubmit {
		margin-bottom: 0 !important;
	}

	body.login-page #login-form.branded-login #bottomline:empty {
		display: none;
	}

	body.login-page #login-form.branded-login #bottomline.support-link-moved {
		display: none !important;
	}
}

@media (max-width: 649px) {
	body.login-page .branded-login-shell {
		width: 100%;
		margin-top: 20px;
		padding: 0 14px;
		box-sizing: border-box;
	}

	body.login-page #login-form.branded-login .branded-login-panel {
		order: 1;
		padding: 24px 24px 12px;
	}

	body.login-page #login-form.branded-login .branded-login-title {
		gap: 6px;
		margin-bottom: 10px;
		font-size: 24px;
	}

	body.login-page #login-form.branded-login .branded-login-title-icon {
		flex-basis: 40px;
		width: 40px;
		height: 40px;
		background-size: 40px 40px;
	}

	body.login-page #login-form.branded-login .branded-login-banner {
		order: 2;
		padding: 12px 24px 24px;
	}

	body.login-page #login-form.branded-login .login-banner {
		aspect-ratio: 1232 / 1284;
		padding: 8px;
	}

	body.login-page .branded-login-brand-logo {
		width: 100%;
		margin-bottom: 30px;
	}

	body.login-page .branded-login-brand-logo img {
		width: 50vw;
		max-width: calc(100vw - 28px);
		max-height: none;
	}

	body.login-page #login-form.branded-login.branded-login-lcn ~ .branded-login-brand-logo img {
		width: auto;
		max-width: 60px;
		max-height: 48px;
	}
}

@media (min-width: 650px) and (max-width: 899px) {
	body.login-page .branded-login-shell {
		width: min(680px, calc(100vw - 48px));
		margin-top: 40px;
	}

	body.login-page #login-form.branded-login .branded-login-panel {
		order: 1;
		padding: 40px 48px 24px;
	}

	body.login-page #login-form.branded-login .branded-login-banner {
		order: 2;
		padding: 20px 48px 40px;
	}

	body.login-page #login-form.branded-login .login-banner {
		aspect-ratio: 1864 / 1440;
		padding: 8px;
	}

	body.login-page .branded-login-brand-logo {
		margin-bottom: 30px;
	}
}