@import url("/fonts/frilufts/frilufts.css");

body {
	background: #f5f5f5;
	color: #181818;
	font-family: "FriluftsProRegular", sans-serif;
	font-size: 16px;
}

main {
	display: block !important;
}

header {
	padding: 28px;
}

.header-logo {
	display: inline-block;
}

.panel {
	background: #fff;
	margin: 24px auto 80px;
	padding: 16px;
	width: 384px;
}

h1,
h2 {
	font-family: "FriluftsProHeadBold", sans-serif;
	font-size: 24px;
	font-weight: 500;
	line-height: 1.2;
	margin-bottom: 40px;
}

h2 {
	font-size: 16px;
	line-height: 1.5;
	margin-bottom: 24px;
}

p {
	line-height: 1.5;
	margin-bottom: 16px;
}

a {
	color: #026a9a;
	text-decoration: underline;
}

a:hover {
	color: #033f5b;
}

hr {
	border-color: #e5e5e5;
	margin: 32px 0;
}

.icon-paragraph {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.note {
	font-size: 14px;
	color: #747474;
}

.input-wrapper {
	display: flex;
	gap: 8px;
	margin-bottom: 16px;
}

input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border-radius: 4px;
	flex-shrink: 0;
	border: 1px solid #ddd;
	background-color: #fff;
	width: 20px;
	height: 20px;
}

input:checked {
	background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0iIzA0NzJBNCIgY2xhc3M9InctNSBoLTUiPg0KICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0xNi43MDQgNC4xNTNhLjc1Ljc1IDAgMDEuMTQzIDEuMDUybC04IDEwLjVhLjc1Ljc1IDAgMDEtMS4xMjcuMDc1bC00LjUtNC41YS43NS43NSAwIDAxMS4wNi0xLjA2bDMuODk0IDMuODkzIDcuNDgtOS44MTdhLjc1Ljc1IDAgMDExLjA1LS4xNDN6IiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIC8+DQo8L3N2Zz4NCg==");
	background-color: #f0f9fd;
	border-color: #026a9a;
}

@media only screen and (max-width: 767px) {
	header {
		text-align: center;
	}

	.panel {
		margin: 0 16px 40px;
		width: calc(100% - 32px);
	}
}

.panel > h1,
.panel > h2,
.panel > hr {
	display: none;
}

.intro {
	display: none;
}

input[type="text"],
input[type="password"],
input[type="email"] {
	width: 100%;
	padding: 12px 16px;
	line-height: 24px;
	margin-top: 8px;
	height: 48px;
}

input:disabled {
	background: #f5f5f5;
}

select {
	width: 100%;
	padding: 12px 16px;
	line-height: 24px;
	margin-top: 8px;
	height: 48px;
	border: 1px solid #ddd;
	border-radius: 4px;
}

select:disabled {
	background: #f5f5f5;
}

button,
button[type="button"],
button[type="reset"],
button[type="submit"] {
	font-family: "FriluftsProHeadBold", sans-serif;
	width: 100%;
	border-radius: 4px;
	padding: 12px 24px;
}

button#continue[tabindex="-1"],
button#continue[aria-disabled="true"] {
	display: none;
}

button#continue[tabindex="-1"] + button#cancel,
button#continue[aria-disabled="true"] + button#cancel {
	margin-top: 0;
}

button#emailVerificationControl_but_change_claims,
button#email_ver_but_edit {
	display: none !important;
}

#emailVerificationControl_but_send_code,
#emailVerificationControl_but_verify_code,
#email_ver_but_send,
#email_ver_but_verify,
button[type="submit"] {
	background-color: #026a9a;
	color: #fff;
}

#emailVerificationControl_but_send_code:hover,
#emailVerificationControl_but_verify_code:hover,
#email_ver_but_send:hover,
#email_ver_but_verify:hover,
button[type="submit"]:hover {
	background-color: #033f5b;
}

#email_ver_but_send,
#email_ver_but_verify,
#email_ver_but_resend {
	margin-top: 16px;
}

.entry-item {
	margin-bottom: 16px;
	display: flex;
	flex-direction: column;
}

.password-label {
	display: flex;
	justify-content: space-between;
}

.divider {
	border-top: 1px solid #e5e5e5;
	height: 1px;
	width: 100%;
	margin: 24px 0;
}

.divider h2 {
	display: none;
}

.create {
	font-family: "FriluftsProHeadBold", sans-serif;
	font-weight: 500;
	margin-bottom: 24px;
}

.create a {
	margin-left: 8px;
}

.error.itemLevel {
	margin-bottom: 0px;
	margin-top: 8px;
	font-size: 14px;
	color: #be340d;
}

.error.itemLevel p {
	margin-bottom: 0px;
}

.error.itemLevel[style="display: block;"] + input {
	border-color: #be340d;
}

.error.itemLevel {
	display: none;
}

.error.itemLevel.show {
	display: block;
}

.error.itemLevel.show + input {
	border-color: #be340d;
}

.error.pageLevel p {
	background: #f0f9fd;
	padding: 4px;
	margin-bottom: 24px;
}

.helpLink.tiny {
	display: none;
}

.verificationControlContent {
	padding-bottom: 24px;
	border-bottom: 1px solid #e5e5e5;
	margin-bottom: 24px;
}

#emailVerificationControl_but_send_new_code,
#cancel,
#email_ver_but_resend {
	border: 1px solid #ddd;
	line-height: 22px;
	margin-top: 16px;
}

#emailVerificationControl_but_send_new_code:hover,
#cancel:hover,
#email_ver_but_resend:hover {
	background-color: #f5f5f5;
}

#attributeList > ul > li {
	margin-bottom: 16px;
}

.CheckboxMultiSelect fieldset .error,
.CheckboxMultiSelect fieldset legend {
	width: 100%;
}

.CheckboxMultiSelect fieldset legend {
	margin-bottom: 8px;
}

.CheckboxMultiSelect fieldset label {
	margin-left: 8px;
}

#cancel {
	margin-bottom: 16px;
}

.emailVerificationCode_li {
	margin-top: 16px;
}

.verificationControlContent ul .EmailBox .attrEntry,
.verificationControlContent ul .TextBox .attrEntry,
.buttons.verify {
	margin-bottom: 16px;
}

.verificationInfoText[aria-hidden="false"] {
	display: block !important;
	margin-bottom: 16px;
}

.verificationSuccessText {
	color: #196619;
	margin-bottom: 16px;
}

.verificationErrorText {
	color: #be340d;
	margin-bottom: 16px;
}

.changeClaims {
	border: 1px solid #ddd;
}

#extension_TermsofUse_True,
#True_option {
	display: inline-block;
	vertical-align: middle;
}

#localAccountForm .working {
	display: none;
}

div#claimVerificationServerError {
	margin-bottom: 0px;
	margin-top: 8px;
	font-size: 14px;
	color: #be340d;
}

.phonewrong {
	color: #be340d;
	font-size: 14px;
}

.intro {
	display: block !important;
	color: var(--Greytones-Black, #181818);
	font-family: "FriluftsProHeadBold", sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: 500;
	line-height: 120%;
}

.intro p {
	margin-bottom: 24px !important;
}

li.Password,
li.DateTimeDropdown {
	margin-bottom: 8px !important;
}

div#requiredFieldMissing {
	display: none !important;
}
div#fieldIncorrect {
	display: none !important;
}

div#passwordEntryMismatch {
	display: none !important;
}
p.birthdayoffer,
p.passwordguide {
	padding-left: 10px;
	color: #747474;
	font-size: 14px;
}

.CheckboxMultiSelect .error.itemLevel.show {
	display: inline;
}

label#extension_TermsofUse_label {
	display: none !important;
}

select#extension_dateOfBirth_day {
	width: auto !important;
	margin-right: 8px;
}

#extension_TermsofUse_True,
#True_option {
	float: left !important;
	margin-right: 10px;
}

label#True_option {
	display: none;
}

input[type="tel"] {
	width: 100%;
	padding: 12px 16px;
	line-height: 24px;
	margin-top: 8px;
	height: 48px;
}

select#extension_dateOfBirth_month {
	width: auto !important;
	margin-right: 8px;
}

select#extension_dateOfBirth_year {
	width: auto !important;
}

#responseMsg_label {
	overflow-y: scroll;
	height: 169px !important;
	border-radius: 4px;
	font-size: 14px;
	flex-shrink: 0;
	padding: 12px 16px;
	line-height: 24px;
	margin-top: 8px;
	border: 1px solid #ddd;
	display: block;
}

label#becomeMember_label {
	color: var(--Greytones-Black, #181818);
	font-family: "FriluftsProHeadBold", sans-serif;
	font-size: 24px;
	font-style: normal;
	font-weight: 500;
	line-height: 120%;
}

.working {
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow:
		32px 0 #fff,
		-32px 0 #fff;
	position: relative;
	animation: flash 0.5s ease-out infinite alternate;
	margin: 16px auto 0 auto;
}

@keyframes flash {
	0% {
		background-color: #8ddbff;
		box-shadow:
			32px 0 #fff2,
			-32px 0 #026a9a;
	}
	50% {
		background-color: #026a9a;
		box-shadow:
			32px 0 #8ddbff,
			-32px 0 #8ddbff;
	}
	100% {
		background-color: #8ddbff;
		box-shadow:
			32px 0 #026a9a,
			-32px 0 #8ddbff;
	}
}
