/* 456496 */
/* imports */
@import url("https://use.typekit.net/afy4xey.css");
/* variables */
:root {
--text-font: "din-2014", sans-serif;
--body-background: #ffffff;
--text-color: #474947;
--text-color-light: #757775;
--text-color-default: #191C19;
--primary: #4C8251;
--primary-dark: #1C4220;
--primary-light: #55925b;
--tertiary: #D9B56A;
--tertiary-hover: linear-gradient(180deg,#faebbc,#ebcd89 50.1%,#c09441);
--panel-border: solid 1px #f3f3f3;
--field-background: #F8F8F8;
--field-background-hover: #F3F3F3;
--field-border: #E8E8E8;
--field-border-hover: #D1D2D1;
--field-border-pass: #4C8251;
--field-note: #5E605E;
--field-disabled-text: #5E605E;
--field-disabled-background: #FCFCFC;
--checkbox-border: #babbba;
--ruler-border: #D1D2D1;
--warning-border: #E26B01;
--icon-chevron-left: url('data:image/svg+xml;utf8,');
--icon-chevron-down: url('data:image/svg+xml;utf8,');
--icon-password-hidden: url('data:image/svg+xml;utf8,');
--icon-password-visible: url('data:image/svg+xml;utf8,');
--icon-validation-warning: url('data:image/svg+xml;utf8,');
--icon-validation-warning-1x: url("../img/warning@4x.png");
--icon-validation-warning-2x: url("../img/warning@4x.png");
--icon-validation-warning-4x: url("../img/warning@4x.png");
--icon-password-failed: url('data:image/svg+xml;utf8,');
--icon-password-passed: url('data:image/svg+xml;utf8,');
--icon-password-untested: url('data:image/svg+xml;utf8,');
--icon-checkbox-checked: url('data:image/svg+xml;utf8,');
--icon-warning: url('data:image/svg+xml;utf8,');
--icon-calendar: url('data:image/svg+xml;utf8,');
--icon-confirmation: url('data:image/svg+xml;utf8,');
--icon-account: url('data:image/svg+xml;utf8,');
--icon-info: url('data:image/svg+xml;utf8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M8%201C4.136%201%201%204.136%201%208C1%2011.864%204.136%2015%208%2015C11.864%2015%2015%2011.864%2015%208C15%204.136%2011.864%201%208%201ZM8.70003%2011.9667H7.30003V7.30003H8.70003V11.9667ZM8.70003%205.9H7.30003V4.5H8.70003V5.9Z%22%20fill%3D%22%232972C4%22%2F%3E%3C%2Fsvg%3E');
--icon-check-circle: url('data:image/svg+xml;utf8,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M10%200C4.48%200%200%204.48%200%2010C0%2015.52%204.48%2020%2010%2020C15.52%2020%2020%2015.52%2020%2010C20%204.48%2015.52%200%2010%200ZM10%2018C5.59%2018%202%2014.41%202%2010C2%205.59%205.59%202%2010%202C14.41%202%2018%205.59%2018%2010C18%2014.41%2014.41%2018%2010%2018ZM8%2012.17L14.59%205.58L16%207L8%2015L4%2011L5.41%209.59L8%2012.17Z%22%20fill%3D%22%234C8251%22%2F%3E%3C%2Fsvg%3E');
--validation-fail: #AF0016;
--validation-partly: #E26B01;
--validation-pass: #3D9144;
--confirmation-background: #E8F0FA;
--confirmation-color: #303230;
--collapse-speed: 0.5s;
--collapse-height: 1200px;
}
@media (min-width:576px) {}
@media (min-width:768px) {}
@media (min-width:992px) {}
@media (min-width:1200px) {}
/* markup */
*, *:before, *:after {
box-sizing: border-box;
}
html {
font-size: 16px;
min-height: 100vh;
}
body {
display: flex;
background-color: var(--body-background);
color: var(--text-color);
font-family: var(--text-font);
font-size: 0.875rem;
font-weight: 400;
line-height: 1.5;
margin: 0;
padding: 0;
min-height: 100vh;
}
@media (min-width:768px) {
body {
font-size: 0.9375rem;
}
}
@media (min-width:992px) {
body {
font-size: 1rem;
}
}
h1,
h2,
h3,
h4 {}
h1 {
font-size: 1.375rem;
font-weight: 600;
line-height: 1.2;
margin: 0 0 0.6rem;
}
h1:empty {
display: none;
}
@media (min-width:576px) {
h1 {
font-size: 1.75rem;
font-weight: 700;
}
}
h2 {
font-size: 1.375rem;
font-weight: 700;
margin: 0 0 0.6rem;
}
@media (min-width:576px) {
h2 {
font-size: 1.5rem;
font-weight: 700;
}
}
h3 {
font-size: 0.875rem;
font-weight: 600;
margin: 0 0 0.6rem;
}
@media (min-width:576px) {
h3 {
font-size: 1.125rem;
}
}
h4 {
font-size: 0.875rem;
font-weight: 600;
margin: 0 0 0.6rem;
}
@media (min-width:576px) {
h4 {
font-size: 1rem;
}
}
p {
margin: 0 0 0.6rem;
}
p.lead {
font-size: 1.125em;
}
p:last-child {
margin: 0;
}
ul, ol {}
a {
color: var(--primary-light);
}
a:hover {
color: var(--primary);
}
a:focus-visible {
outline: none;
box-shadow: 0px 0px 0px 2px #fff, 0px 0px 0px 4px #5695dc;
border-radius: 2px;
}
/* input elements */
select,
textarea,
input[type=text],
input[type=password],
input[type=url],
input[type=tel],
input[type=search],
input[type=number],
input[type=date],
input[type=datetime],
input[type=email] {
grid-area: field;
font-family: var(--text-font);
font-size: 0.9375rem;
border-width: 0 0 2px 0;
border-style: solid;
border-color: var(--field-border);
background-color: var(--field-background);
color: var(--field-note);
min-height: 2.875rem;
padding: 0 1rem;
margin: 0.2rem 0;
transition-property: background-color, border-color;
transition-delay: 300ms;
transition-duration: 0ms;
}
@media (min-width:992px) {
select,
textarea,
input[type=text],
input[type=password],
input[type=url],
input[type=tel],
input[type=search],
input[type=number],
input[type=date],
input[type=datetime],
input[type=email] {
font-size: 1rem;
min-height: 3rem;
}
}
select:hover,
textarea:hover,
input[type=text]:hover,
input[type=password]:hover,
input[type=url]:hover,
input[type=tel]:hover,
input[type=search]:hover,
input[type=number]:hover,
input[type=date]:hover,
input[type=datetime]:hover,
input[type=email]:hover {
border-color: var(--field-border-hover);
background-color: var(--field-background-hover);
}
select:focus,
textarea:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=url]:focus,
input[type=tel]:focus,
input[type=search]:focus,
input[type=number]:focus,
input[type=date]:focus,
input[type=datetime]:focus,
input[type=email]:focus {
outline: none;
border-color: var(--field-border-pass);
background-color: var(--field-background-hover);
transition-delay: 0ms;
}
select[readonly],
textarea[readonly],
input[type=text][readonly],
input[type=password][readonly],
input[type=url][readonly],
input[type=tel][readonly],
input[type=search][readonly],
input[type=number][readonly],
input[type=date][readonly],
input[type=datetime][readonly],
input[type=email][readonly] {
border-color: var(--field-border);
background-color: var(--field-disabled-background);
color: var(--field-disabled-text);
cursor: default;
}
select:disabled,
textarea:disabled,
input[type=text]:disabled,
input[type=password]:disabled,
input[type=url]:disabled,
input[type=tel]:disabled,
input[type=search]:disabled,
input[type=number]:disabled,
input[type=date]:disabled,
input[type=datetime]:disabled,
input[type=email]:disabled {
border-color: var(--field-border);
background-color: var(--field-disabled-background);
color: var(--field-disabled-text);
cursor: default;
}
[data-control="keyboard"] select:focus-visible,
[data-control="keyboard"] textarea:focus-visible,
[data-control="keyboard"] input[type=text]:focus-visible,
[data-control="keyboard"] input[type=password]:focus-visible,
[data-control="keyboard"] input[type=url]:focus-visible,
[data-control="keyboard"] input[type=tel]:focus-visible,
[data-control="keyboard"] input[type=search]:focus-visible,
[data-control="keyboard"] input[type=number]:focus-visible,
[data-control="keyboard"] input[type=date]:focus-visible,
[data-control="keyboard"] input[type=datetime]:focus-visible,
[data-control="keyboard"] input[type=email]:focus-visible {
outline: none;
box-shadow: 0px 0px 0px 2px #fff, 0px 0px 0px 4px #5695dc;
border-radius: 2px 2px 0px 0px;
}
/*
input[type="date"]::-webkit-inner-spin-button,
input[type="date"]::-webkit-calendar-picker-indicator {
display: none;
-webkit-appearance: none;
}
*/
input::placeholder {
color: Transparent;
}
input:-webkit-autofill {
background-color: var(--field-background) !important;
-webkit-box-shadow: 0 0 0 50px var(--field-background) inset;
}
input:hover:-webkit-autofill,
input:focus:-webkit-autofill {
background-color: var(--field-background-hover) !important;
-webkit-box-shadow: 0 0 0 50px var(--field-background-hover) inset;
}
/*
.error[aria-hidden="false"] ~ input,
.error[aria-hidden="false"] ~ input:focus,
.error[aria-hidden="false"] ~ input:hover,
.error.show ~ input,
.error.show ~ input:focus,
.error.show ~ input:hover,
*/
input.invalid,
input.invalid:focus,
input.invalid:hover,
input.highlightError,
input.highlightError:focus,
input.highlightError:hover,
input[data-valid="false"],
input[data-valid="false"]:focus,
input[data-valid="false"]:hover {
border-color: var(--validation-fail);
transition-duration: 600ms;
}
select {
appearance: none;
background-image: var(--icon-chevron-down);
background-position: center right 1rem;
background-repeat: no-repeat;
background-size: 1rem;
padding-right: 3rem;
}
textarea {}
input[type="radio"],
input[type="checkbox"] {
appearance: none;
margin: 0;
width: 1.375rem;
height: 1.375rem;
border-radius: 3px;
border: solid 2px var(--checkbox-border) !important;
}
input[type="radio"] {
border-radius: 50%;
border-color: var(--text-color);
}
input[type="radio"]:checked,
input[type="checkbox"]:checked {
background-color: var(--primary);
border-color: var(--primary);
background-image: var(--icon-checkbox-checked);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
input[type="date"] {
text-transform: uppercase;
width: 100%;
appearance: none;
-webkit-appearance: none;
}
input[type="date"]::-webkit-calendar-picker-indicator {
cursor: pointer;
background-image: var(--icon-calendar);
background-size: 1.2rem 1.2rem;
background-repeat: no-repeat;
background-position: center;
}
/* buttons */
button {
font-family: var(--text-font);
}
button:focus-visible {
outline: none;
box-shadow: 0px 0px 0px 2px #fff, 0px 0px 0px 4px #5695dc;
border-radius: 2px;
}
.button,
.sso-login .create a,
.button-secondary,
button:not([id="cancel"]):not(.accountButton):not(.sendNewCode):not(.changeClaims):not(.password):not(.unstyled) {
cursor: pointer;
display: inline-flex;
align-items: center;
justify-content: center;
text-align: center;
border: none;
font-family: var(--text-font);
font-weight: 600;
line-height: 1;
transition-property: background-color, color;
transition-duration: 0.2s;
text-transform: uppercase;
text-decoration: none;
width: 100%;
min-height: 3rem;
font-size: 1rem;
border: solid 2px var(--primary);
border-radius: 2px;
letter-spacing: 0.2em;
padding: 0 0.75rem;
background-color: #fff;
color: var(--primary);
}
@media (min-width:992px) {
.sso-login .create a,
.button-secondary,
button:not([id="cancel"]):not(.accountButton):not(.sendNewCode):not(.changeClaims):not(.password):not(.unstyled) {
max-width: 14.625rem;
padding: 0 1.5rem;
}
}
.sso-login .create a:hover,
.button-secondary:hover,
button:not([id="cancel"]):not(.accountButton):not(.sendNewCode):not(.changeClaims):not(.password):not(.unstyled):hover {
background-color: var(--primary);
color: #fff;
}
.button-primary,
button[type="submit"] {
background-color: var(--primary) !important;
border-color: var(--primary) !important;
color: #fff !important;
}
.button-primary:hover,
button[type="submit"]:hover {
background-color: var(--primary-light) !important;
border-color: var(--primary-light) !important;
color: #fff !important;
}
[data-signup] #continue,
.button-tertiary[type="submit"],
.button-tertiary {
background-color: var(--tertiary) !important;
border-color: var(--tertiary) !important;
color: var(--primary-dark) !important;
}
[data-signup] #continue:hover,
.button-tertiary[type="submit"]:hover,
.button-tertiary:hover {
background-color: var(--tertiary) !important;
background-image: var(--tertiary-hover) !important;
border-color: var(--tertiary) !important;
color: var(--primary-dark) !important;
}
#cancel,
.sendNewCode,
.changeClaims,
.button-link-alt,
.button-link {
cursor: pointer;
background-color: transparent;
display: inline-block;
color: var(--primary);
text-decoration: none;
text-transform: uppercase;
letter-spacing: 0.2em;
font-family: var(--text-font);
font-size: 1rem;
font-weight: 600;
line-height: 1;
border-style: solid;
border-color: #D1D2D1;
border-width: 0 0 2px 0;
padding: 0 0 0.6rem;
}
#cancel:hover,
.sendNewCode:hover,
.button-link-alt:hover,
.button-link:hover {
color: var(--primary-light);
}
#cancel.button-link-alt,
.button-link-alt {
color: var(--primary-dark);
border-color: var(--tertiary);
}
#cancel.button-link-alt:hover,
.button-link-alt:hover {
color: var(--primary);
}
/* input fields */
.intro {}
.intro p:last-child {
margin: 0 0 1.5rem;
}
.intro p:empty {
display: none;
}
.error.pageLevel {
color: var(--validation-fail);
}
.attr {}
.verificationControlContent > ul,
.attr > ul {
list-style: none;
margin: 0;
padding: 0;
}
.verificationControlContent > ul > li,
.attr > ul > li {
padding: 0;
}
.entry-item,
li.TextBox,
li.Password,
li.DateTimeDropdown {
display: grid;
grid-template-columns: auto auto;
grid-template-rows: auto auto auto auto;
grid-template-areas: "label label" "field field" "validation validation";
/*grid-template-areas: "label help" "field field" "validation validation";*/
margin: 0 0 1rem;
}
@media (min-width:992px) {
.entry-item,
li.TextBox,
li.Password,
li.DateTimeDropdown {
margin: 0 0 1.75rem;
}
}
.entry-item[style="display: inline;"],
li.TextBox[style="display: inline;"],
li.Password[style="display: inline;"],
li.DateTimeDropdown[style="display: inline;"] {
display: grid !important;
}
.helpLink.tiny {
display: none;
font-size: 0.75rem;
outline: none;
}
.entry-item .helpLink,
li.TextBox .helpLink,
li.Password .helpLink,
li.DateTimeDropdown .helpLink {
grid-area: help;
justify-self: flex-end;
align-self: center;
}
.attrEntry {
display: contents;
}
.entry-item label,
.attrEntry label {
grid-area: label;
font-size: 0.875rem;
font-weight: 600;
grid-area: label;
margin: 0.2rem 0;
}
@media (min-width:992px) {
.entry-item label,
.attrEntry label {
font-size: 1rem;
}
}
/*
.entry-item[data-valid="false"] label,
.attrEntry[data-valid="false"] label {
color: var(--validation-fail);
}
.entry-item[data-valid="false"] input + label,
.attrEntry[data-valid="false"] input + label,
.entry-item[data-valid="false"] label span,
.attrEntry[data-valid="false"] label span {
color: var(--text-color);
}
*/
.entry-item label strong,
.attrEntry label strong {
display: block;
margin-bottom: 0.5rem;
}
.entry-item label span,
.attrEntry label span {
font-weight: normal;
font-size: 0.9375rem;
}
.entry-item .confirmation,
.attrEntry .confirmation {
grid-area: validation;
display: inline-flex;
gap: 0.5rem;
color: var(--validation-pass);
margin: 0.2rem 0;
}
.error.pageLevel,
.error.itemLevel,
.error.verificationErrorText {
grid-area: validation;
color: var(--validation-fail);
margin: 0.2rem 0;
padding-left: 1.75rem;
background-image: var(--icon-validation-warning-2x);
background-repeat: no-repeat;
background-position: left 0.25rem top 0.15rem;
background-size: 1.125rem;
}
.error.itemLevel {
display: block !important;
overflow: hidden;
max-height: 0;
opacity: 0;
transition-property: opacity, max-height;
transition-duration: 0ms;
}
.itemLevel.error.show,
[data-valid="false"] .itemLevel.error,
.entry-item .error.itemLevel[style="display: block;"] {
display: block !important;
max-height: 10rem;
opacity: 1;
transition-duration: 300ms;
}
.error.itemLevel:empty {
display: none !important;
}
.helpLink
.attrEntry .textInput {
grid-area: field;
}
li.TextBox[class*="_BusinessContactNumber_"],
li.TextBox[class*="_PhoneNumber_"],
li.TextBox[class*="strongAuthenticationPhoneNumber"] {}
li.TextBox[class*="_BusinessContactNumber_"] .textInput,
li.TextBox[class*="_PhoneNumber_"] .textInput,
li.TextBox[class*="strongAuthenticationPhoneNumber"] .textInput {
padding-left: 6.5rem;
padding-top: 0.1rem;
}
li.TextBox[class*="_BusinessContactNumber_"] .attrEntry:before,
li.TextBox[class*="_PhoneNumber_"] .attrEntry:before,
li.TextBox[class*="strongAuthenticationPhoneNumber"] .attrEntry:before {
grid-area: field;
display: inline-flex;
align-items: center;
justify-content: flex-end;
font-size: 0.9375rem;
content: "+61";
color: #757775;
width: 6rem;
height: 3rem;
margin: 0.2rem 0;
z-index: 10;
background-image: url(../img/flag-australia.svg);
background-size: 2.4rem auto;
background-repeat: no-repeat;
background-position: center left 1rem;
}
@media (min-width:992px) {
li.TextBox[class*="_BusinessContactNumber_"] .attrEntry:before,
li.TextBox[class*="_PhoneNumber_"] .attrEntry:before,
li.TextBox[class*="strongAuthenticationPhoneNumber"] .attrEntry:before{
font-size: 1rem;
}
}
li.CheckboxMultiSelect {
display: grid;
grid-template-columns: auto auto 100fr;
grid-template-rows: auto 1fr;
grid-template-areas: "heading heading heading" "control label help" "validation validation validation";
gap: 0 0.5rem;
align-items: center;
margin: 0 0 0.75rem;
}
li.CheckboxMultiSelect .helpLink {
grid-area: help;
}
li.CheckboxMultiSelect label:first-child {
grid-area: heading;
margin-bottom: 0.75rem;
color: var(--text-color);
}
li.CheckboxMultiSelect label:empty {
display: none;
}
li.CheckboxMultiSelect .error {}
li.CheckboxMultiSelect input {
grid-area: control;
align-self: flex-start;
margin: 0.25rem 0;
}
li.CheckboxMultiSelect input + label {
font-weight: normal;
}
li.RadioSingleSelect {
display: flex;
gap: 0 0.5rem;
flex-wrap: wrap;
align-items: center;
}
li.RadioSingleSelect label {
font-weight: 400;
}
li.RadioSingleSelect label:first-of-type {
flex: 1 1 100%;
font-weight: 600;
}
li.RadioSingleSelect label + input {
margin-left: 1rem;
}
li.DateTimeDropdown {}
li.DateTimeDropdown .date {
grid-area: field;
display: flex;
gap: 0.5rem;
}
li.DateTimeDropdown .date[data-replicated] {
visibility: hidden;
position: absolute;
}
li.DateTimeDropdown .date .day {
flex: 0 1 25%;
}
li.DateTimeDropdown .date .month {
flex: 0 1 50%;
}
li.DateTimeDropdown .date .year {
flex: 0 1 25%;
}
li.DateTimeDropdown .helpLink {}
.buttons {
display: flex;
flex-direction: column;
align-items: center;
gap: 1rem;
}
@media (min-width: 992px) {
.buttons {
gap: 1.5rem
}
}
.attr + .buttons:first-child {
margin-top: 2rem;
}
/* layout: login */
.sso-login {
flex: 1 1 100%;
display: grid;
grid-template-columns: auto;
grid-template-rows: 2.5rem 18.75rem auto;
grid-template-areas:
"header"
"hero"
"content";
display: flex;
flex-direction: column;
}
@media (min-width:576px) {
.sso-login {
grid-template-rows: 2.5rem 25rem auto;
}
}
@media (min-width:768px) {
.sso-login {
grid-template-columns: 1fr 1fr;
grid-template-rows: 4.25rem auto;
grid-template-areas:
"header header"
"hero content";
}
}
@media (min-width:480px){
.sso-login-header{
padding: 0.38rem 1rem !important;
}
}
.sso-login-header {
grid-area: header;
background-color: var(--primary-dark);
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 1rem;
}
.sso-login-header .referer {
display: inline-flex;
align-items: center;
gap: 0.5rem;
color: #fff;
font-size: 0.875rem;
font-weight: 700;
text-decoration: none;
}
.sso-login-header .referer:before {
content: "";
display: block;
width: 1.5rem;
height: 1.5rem;
background-image: var(--icon-chevron-left);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.sso-login-header .referer:not([data-active]) {
width: 1px;
height: 1px;
overflow: hidden;
opacity: 0;
}
.sso-login-header .branding {
display: block;
height: 100%;
max-height: 1.75rem;
}
.sso-login-header .removeHeaderBtn{
visibility: hidden;
}
@media (min-width:768px) {
.sso-login-header .branding {
max-height: none;
}
}
.sso-login-header .branding img {
display: block;
width: auto;
height: 100%;
}
/* Content panel */
.sso-login-content {
grid-area: content;
padding: 1.5rem 2rem;
display: flex;
justify-content: center;
height: 100%;
}
.sso-login-content .panel {
display: flex;
flex-direction: column;
align-items: stretch;
}
@media (min-width:992px) {
.sso-login-content .panel {
background-color: var(--body-background);
padding: 2rem;
border-radius: 0.5rem;
border: var(--panel-border);
box-shadow: 0px 4px 8px 3px rgba(0, 0, 0, 0.15), 0px 1px 3px rgba(0, 0, 0, 0.3);
max-width: 28rem;
min-height: 37.5rem;
}
.sso-login-content{
align-items: center;
}
}
@media (min-width:1200px) {
.sso-login-content .panel {
max-width: 38.125rem;
}
.sso-login-content{
align-items: center;
}
}
/* layout: signup */
.sso-signup {
flex: 1 1 100%;
display: grid;
grid-template-columns: auto;
grid-template-rows: 2.5rem 18.75rem auto;
grid-template-areas:
"header"
"hero"
"content";
}
@media (min-width:576px) {
.sso-signup {
grid-template-rows: 4.25rem 25rem auto;
padding-bottom: 5rem;
}
}
@media (min-width:768px) {
.sso-signup {
grid-template-rows: 4.25rem 30rem auto;
}
}
@media (min-width:992px) {
.sso-signup {}
}
/* Signup banner */
.sso-login-hero{
display: none !important;
}
.sso-login-hero,
.sso-signup-masthead {
grid-area: hero;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 48px 102px 44px 100px;
grid-template-areas: "title" "heading" "tagline" "image";
}
@media(min-width:576px) {
.sso-login-hero,
.sso-signup-masthead {
grid-template-columns: 1fr 1fr;
grid-template-rows: 119px 169px 100px;
grid-template-areas: "title image" "heading image" "tagline image";
}
}
@media(min-width:768px) {
.sso-login-hero {
grid-template-columns: 1fr;
grid-template-rows: 16.667% 33.333% 16.667% 33.333%;
grid-template-areas: "title" "heading" "tagline" "image";
}
.sso-signup-masthead {
grid-template-columns: 1fr 1fr;
grid-template-rows: 123px 229px 120px;
grid-template-areas: "title image" "heading image" "tagline image";
}
}
@media(min-width:992px) {}
@media(min-width:1200px) {}
@media(min-width:1920px) {}
.sso-brand-title{
display: flex;
justify-content: center;
align-items: center;
padding: 10px 0;
border-bottom: 2px solid var(--primary-dark);
}
.sso-banner-title {
grid-area: title;
display: flex;
align-items: center;
justify-content: center;
padding: 39px 0 0;
}
.sso-banner-title img {
display: block;
width:100%;
height:auto;
}
.sso-banner-heading {
grid-area: heading;
display: flex;
align-items: center;
justify-content: center;
padding: 10px 0 2px;
}
.sso-banner-heading picture {
display: contents;
}
.sso-banner-heading img {
display: block;
width:100%;
height:auto;
}
.sso-banner-tagline {
grid-area: tagline;
display: flex;
align-items: center;
justify-content: center;
background-color: var(--tertiary);
border-style: solid;
border-width: 3px 0;
border-color: var(--primary-dark);
}
@media(min-width:576px) {
.sso-banner-tagline {
border-width: 4px 0;
}
}
.sso-banner-tagline picture {
display: contents;
}
.sso-banner-tagline img {
display: block;
width:100%;
height:auto;
}
.sso-banner-image {
grid-area: image;
}
.sso-banner-image img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.sso-signup-masthead .sso-banner-image img {
object-position: 40% 50%;
}
.sso-login-hero .sso-banner-title img { max-width: 104px; }
.sso-login-hero .sso-banner-heading img { max-width: 245.32px; }
.sso-login-hero .sso-banner-tagline img { max-width: 260.32px; }
.sso-signup-masthead .sso-banner-title img { max-width: 104px; }
.sso-signup-masthead .sso-banner-heading img { max-width: 245.32px; }
.sso-signup-masthead .sso-banner-tagline img { max-width: 260.32px; }
@media(min-width:576px) {
.sso-login-hero .sso-banner-title img { max-width: 231px; }
.sso-login-hero .sso-banner-heading img { max-width: 198.86px; }
.sso-login-hero .sso-banner-tagline img { max-width: 226.48px; }
.sso-signup-masthead .sso-banner-title img { max-width: 231px; }
.sso-signup-masthead .sso-banner-heading img { max-width: 198.86px; }
.sso-signup-masthead .sso-banner-tagline img { max-width: 226.48px; }
.sso-signup-masthead .sso-banner-image { border-width: 0 0 4px 4px; border-style: solid; border-color: var(--primary-dark); }
}
@media(min-width:768px) {
.sso-signup-hero .sso-banner-heading img { max-width: 212.12px; }
.sso-login-hero .sso-banner-tagline img { max-width: 301.42px; }
.sso-signup-masthead .sso-banner-heading img { max-width: 214.82px; }
.sso-signup-masthead .sso-banner-tagline img { max-width: 284.18px; }
}
@media(min-width:992px) {
.sso-login-hero .sso-banner-heading img { max-width: 409.91px; }
.sso-login-hero .sso-banner-tagline img { max-width: 391.19px; }
.sso-signup-masthead .sso-banner-heading img { max-width: 418.64px; }
.sso-signup-masthead .sso-banner-tagline img { max-width: 337.41px; }
}
@media(min-width:1200px) {
.sso-login-hero .sso-banner-heading img { max-width: 426.64px; }
.sso-login-hero .sso-banner-tagline img { max-width: 447.07px; }
.sso-signup-masthead .sso-banner-tagline img { max-width: 534px; }
}
@media(min-width:1920px) {
.sso-login-hero .sso-banner-title img { max-width: calc(230.55/941*100%); }
.sso-login-hero .sso-banner-heading img { max-width: calc(511.97/941*100%); }
.sso-login-hero .sso-banner-tagline img { max-width: calc(530.82/941*100%); }
}
/* Signup content */
.sso-signup-content {
grid-area: content;
padding: 0.8rem 1rem;
width: calc(100% - 2rem);
margin: 0 auto;
max-width: 32.5rem;
box-sizing: content-box;
}
.sso-signup-content .emailField{
margin-bottom: 0.25rem;
}
@media (min-width:576px) {
.sso-signup-content {
padding: 2.25rem 2.25rem;
width: calc(100% - 4.5rem);
}
}
@media (min-width:992px) {
.sso-signup-content {
max-width: 45rem;
}
}
.sso-signup .error.pageLevel {
margin: -1.5rem 0 1.5rem;
}
.sso-signup .heading h1 {
color: #191C19;
}
/* Footnote */
.sso-footnote {
margin: 1rem 0;
font-size: 1rem;
}
@media (min-width:992px) {
.sso-footnote {
margin: 2.25rem 0;
}
}
.sso-footnote hr {
border-style: solid;
border-width: 1px 0 0 0;
border-color: var(--ruler-border);
max-width: 420px;
margin: 1rem auto;
}
@media (min-width:576px) {
.sso-footnote hr {
}
}
.sso-footnote p {
margin-bottom: 1.5rem;
}
.sso-footnote p:last-of-type {
margin-bottom: 0.7rem;
}
/* FAQ Accordion */
.sso-faq {
margin: 1rem 0;
}
.sso-faq:before {
display: block;
content: "";
background-color: #191C19;
height: 1px;
width: 100%;
max-width: 608px;
}
.sso-faq dt {
cursor: pointer;
display: flex;
justify-content: space-between;
gap: 1rem;
font-size: 0.875rem;
font-weight: 600;
padding: 0.5rem 1rem;
}
@media (min-width:576px) {
.sso-faq dt {
font-size: 1.125rem;
}
}
@media (min-width:992px) {
.sso-faq dt {
padding: 1rem;
}
}
.sso-faq dt:after {
display: block;
content: "";
width: 1rem;
height: 1rem;
min-width: 1rem;
background-image: var(--icon-chevron-down);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin: 0.2rem 0 0;
transform: rotate(0deg);
}
@media (min-width:992px) {
.sso-faq dt:after {
margin: 0.35rem 0 0;
}
}
.sso-faq dt[data-toggled="true"]:after {
transform: rotate(180deg);
}
.sso-faq dd {
margin: 0;
border-bottom: solid 1px var(--ruler-border);
overflow: hidden;
transition-property: max-height, padding;
transition-duration: var(--collapse-speed);
max-height: 0;
padding: 0 1rem;
}
.sso-faq dt[data-toggled="true"] + dd {
max-height: var(--collapse-height);
padding: 0 1rem 1rem;
}
/* layout: edit profile */
.sso-profile {
flex: 1 1 100%;
display: grid;
grid-template-columns: auto;
grid-template-rows: 2.5rem auto;
grid-template-areas:
"header"
"content";
}
@media (min-width:576px) {
.sso-profile {
grid-template-rows: 2.5rem auto;
padding-bottom: 5rem;
}
}
@media (min-width:768px) {
.sso-profile {
grid-template-rows: 4.25rem auto;
}
}
@media (min-width:992px) {
.sso-profile {
background-color: #F5F5F5;
grid-template-rows: 4.25rem auto;
}
}
.sso-profile-content {
background-color: #fff;
width: 100%;
max-width: 59.25rem;
margin: 0 auto;
padding: 2.625rem 1rem;
}
@media(min-width:768px) {
.sso-profile-content {
margin: 0 auto;
padding: 2.625rem 6.25rem;
}
}
@media(min-width:992px) {
.sso-profile-content {
margin: 2.625rem auto 0;
}
}
.sso-profile-content .extension_OptInMarketingConsentChoice_li,
.sso-profile-content .extension_TermsOfUseConsentChoice_li,
.sso-profile-content .extension_IsBusinessAccount_li {
display: none;
}
/* reveal password */
input[data-type="password"] ~ button.password {
grid-area: field;
cursor: pointer;
border: none;
background-color: transparent;
width: 1.5rem;
height: 1.5rem;
min-height: auto;
padding: 0;
overflow: hidden;
white-space: nowrap;
text-indent: 150%;
color: transparent;
margin-right: 1rem;
align-self: center;
justify-self: flex-end;
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
input[data-type="password"] ~ button.password:hover {
background-color: transparent;
}
input[data-type="password"] {
padding-right: 3rem;
}
input[data-type="password"]::-ms-reveal {
display: none
}
input[data-type="password"][type="text"] ~ button.password {
background-image: var(--icon-password-visible);
}
input[data-type="password"][type="password"] ~ button.password {
background-image: var(--icon-password-hidden);
}
/* create password */
.pwd-conditions {
grid-area: conditions;
list-style: none;
padding: 0;
margin: 0.25rem 0 0.75rem;
}
.pwd-conditions li {
display: flex;
gap: 0.5rem;
margin: 0 0 0.5rem;
}
.pwd-conditions li:before {
content: "";
display: inline-block;
width: 1.5rem;
height: 1.5rem;
background-image: var(--icon-password-untested);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.pwd-conditions li[data-passed="true"]:before {
background-image: var(--icon-password-passed);
}
.pwd-conditions li[data-passed="false"]:before {
background-image: var(--icon-password-failed);
background-size: 1.25rem;
}
.pwd-strength {
grid-area: strength;
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 0.5rem;
padding: 0.25rem 0 0;
}
@media (min-width:768px) {
.pwd-strength {
flex-wrap: nowrap;
}
}
.pwd-strength .label {
flex: 1 1 100%;
font-size: 0.875rem;
}
@media (min-width:768px) {
.pwd-strength .label {
font-size: 1rem;
flex: 0 1 auto;
}
}
.pwd-strength .label strong {}
.pwd-strength .meter {
flex: 1 1 auto;
display: inline-flex;
gap: 1px;
background-color: #fff;
height: 0.25rem;
/*max-width: 15rem;*/
border-radius: 0.25rem;
overflow: hidden;
}
@media (min-width:768px) {
.pwd-strength .meter {
height: 0.5rem;
}
}
.pwd-strength .meter span {
flex: 0 1 33.333%;
display: inline-flex;
height: 0.5rem;
background-color: var(--field-border);
}
@media (min-width:768px) {
.pwd-strength .meter span {
height: 0.5rem;
}
}
.pwd-strength [data-strength="weak"] span.low {
background-color: var(--validation-fail);
}
.pwd-strength [data-strength="normal"] span.low,
.pwd-strength [data-strength="normal"] span.medium {
background-color: var(--validation-partly);
}
.pwd-strength [data-strength="strong"] span.low,
.pwd-strength [data-strength="strong"] span.medium,
.pwd-strength [data-strength="strong"] span.high {
background-color: var(--validation-pass);
}
/* infographic */
.sso-reasons {
display: flex;
gap: 2rem 1rem;
flex-direction: column;
justify-content: space-evenly;
align-items: center;
padding: 1rem 0 2.5rem;
}
@media (min-width:576px) {
.sso-reasons {
flex-direction: row;
align-items: flex-start;
}
}
.sso-reasons figure {
margin: 0;
text-align: center;
}
.sso-reasons img {}
.sso-reasons figcaption {}
/* confirmation message */
.verificationInfoText > div,
.verificationSuccessText > div,
.sso-confirmation {
font-size: 0.875rem;
color: var(--confirmation-color);
background-color: var(--confirmation-background);
background-image: var(--icon-confirmation);
margin: 0.5rem 0;
padding: 0.5rem 0.5rem 0.5rem 2.25rem;
background-repeat: no-repeat;
background-size: 1.25rem;
background-position: left 0.5rem top 0.5rem;
}
.verificationErrorText > div[style="display: inline;"],
.verificationInfoText > div[style="display: inline;"],
.verificationSuccessText > div[style="display: inline;"] {
display: flex !important;
}
@media (min-width:992px) {
.verificationInfoText > div,
.verificationSuccessText > div,
.sso-confirmation {
font-size: 0.9375rem;
}
}
#emailVerificationControl_error_message[data-doubleerror="true"][data-generationexceeded="false"] {
display: none !important;
}
/* error message */
[data-login] .error.pageLevel,
[data-edit-signin] .error.pageLevel,
.sso-error {
order: 40;
font-size: 0.875rem;
color: var(--text-color);
background-image: none;
border-style: solid;
border-width: 1px 1px 1px 5px;
border-color: var(--validation-fail);
border-radius: 2px;
padding: 0.8rem 1rem;
min-height: 3.25rem;
}
[data-login] .error.pageLevel p,
[data-edit-signin] .error.pageLevel p,
.sso-error p {
display: flex;
gap: 0.5rem;
line-height: 1.5rem;
}
[data-login] .error.pageLevel p:before,
[data-edit-signin] .error.pageLevel p:before,
.sso-error p:before {
content: "";
display: block;
width: 1.125rem;
height: 1.125rem;
min-width: 1.125rem;
background-image: var(--icon-validation-warning-2x);
background-repeat: no-repeat;
background-position: center;
background-size: 1.125rem;
transform: translateY(0.125rem);
}
/* warning message */
.sso-warning {
display: grid;
grid-template-columns: 1.5rem auto;
grid-template-rows: auto auto;
grid-template-areas:
"icon title"
"icon message";
gap: 0 1rem;
font-size: 0.875rem;
margin: 1rem 0 2rem;
border-style: solid;
border-width: 1px 1px 1px 5px;
border-color: var(--warning-border);
border-radius: 2px;
padding: 0.8rem 1rem;
}
@media (min-width:992px) {
.sso-warning {
padding: 1.5rem 1rem;
font-size: 0.9375rem;
}
}
.sso-warning:before {
grid-area: icon;
display: block;
content: "";
width: 1.25rem;
height: 1.25rem;
background-image: var(--icon-warning);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
@media (min-width:992px) {
.sso-warning:before {
width: 1.5rem;
height: 1.5rem;
}
}
.sso-warning strong {
grid-area: title;
display: flex;
font-weight: 600;
}
.sso-warning span {
grid-area: message;
display: block;
}
/*Join now note*/
.join-note,
.resend-note{
display: grid;
grid-template-columns: 1.5rem auto;
grid-template-rows: auto auto;
grid-template-areas:
"icon title"
"icon message";
gap: 0 0.5rem;
font-size: 0.875rem;
margin: 1.25rem 0 2rem;
background: var(--confirmation-background);
padding: 8px;
}
.join-note:before,
.resend-note:before{
grid-area: icon;
display: block;
content: "";
width: 1.25rem;
height: 1.25rem;
background-image: var(--icon-info);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.resend-note{
margin: 1.25rem 0 0 !important;
}
/* Business Type Picker */
.sso-businesstypes {
grid-area: validation;
overflow: hidden;
max-height: 0;
margin: -0.2rem 0 0 0;
transition-property: max-height;
transition-duration: 500ms;
border-radius: 5px;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.03), 0 -1px 31px rgba(0, 0, 0, 0.04);
}
.sso-businesstypes[data-open="true"] {
max-height: 50vh;
overflow-x: hidden;
overflow-y: auto;
}
.sso-businesstypes button {
cursor: pointer;
display: block;
border-style: solid;
border-width: 0 0 1px 0;
border-color: var(--field-border);
background-color: #fff;
width: 100%;
padding: 0.625rem;
text-align: left;
font-size: 1rem;
}
.sso-businesstypes button:hover {
background-color: #eef8ef;
}
.sso-businesstypes-toggle {
grid-area: field;
justify-self: flex-end;
background-image: var(--icon-chevron-down);
background-size: 1rem auto;
background-position: center;
background-repeat: no-repeat;
margin: 0.2rem 0;
width: 3rem;
height: 3rem;
border: none;
background-color: transparent;
overflow: hidden;
text-align: left;
text-indent: 150%;
}
.sso-businesstypes-toggle[data-open="true"] {
transform: rotate(180deg);
}
/* busy modal */
.verifying-modal #verifying_blurb,
#simplemodal-container #verifying_blurb {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #fff;
color: #fff;
height: 100vh;
width: 100vw;
opacity: 0.95;
position: fixed;
left: 0px;
top: 0px;
z-index: 1001;
font-size: 16px;
color: #191C19;
}
[data-pageerror="true"] .verifying-modal #verifying_blurb,
[data-pageerror="true"] #simplemodal-container #verifying_blurb,
[data-servererror="true"] .verifying-modal #verifying_blurb,
[data-servererror="true"] #simplemodal-container #verifying_blurb {
display: none;
}
.verifying-modal #verifying_blurb:before,
#simplemodal-container #verifying_blurb:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
position: relative;
animation: loader-uofc939by 1.5s ease infinite;
margin: 0 auto 70px auto;
border-radius: 50px;
}
.verifying-modal #verifying_blurb:empty,
#simplemodal-container #verifying_blurb:empty {
display: none;
}
/* API: Login Prompt */
[data-login] {}
[data-login] .claims-provider-list-buttons,
[data-login] #localAccountForm,
[data-login] #localAccountForm .entry {
display: contents;
}
[data-login] .claims-provider-list-buttons > .intro {
order: 15;
}
[data-login] .claims-provider-list-buttons > .intro h2:empty {
display: none;
}
[data-login] .intro {
order: 10;
}
[data-login] .options {
order: 44;
margin: -0.5rem 0 1.5rem;
}
[data-login] .divider {
display: none;
}
[data-login] .error.pageLevel {
order: 45;
margin: 0.5rem 0 2rem;
}
[data-edit-signin] .working,
[data-login] .working {
display: none;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
gap: 0;
margin: 0.5rem 0 2rem;
min-height: 3.25rem;
font-size: 16px;
color: #191C19;
}
[data-edit-signin] .working:before,
[data-login] .working:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
position: relative;
animation: loader-uofc939by 1.5s ease infinite;
margin: 0 auto 70px auto;
border-radius: 50px;
}
[data-edit-signin] .working[style="display: block;"],
[data-login] .working[style="display: block;"] {
display: flex !important;
}
[data-login] .entry-item {
order: 40;
}
[data-login] .entry-item [value*="@"] {
border-color: var(--primary);
background-color: var(--field-background);
}
[data-login] .entry-item .message {
display: none;
color: var(--primary);
}
[data-login] .entry-item [value*="@"] ~ .message {
display: block;
font-weight: 300;
}
[data-login] .password-label #forgotPassword,
[data-edit-signin] .password-label #forgotPassword {
display: none;
}
[data-login] .working {
order: 50;
}
[data-login] .buttons {
order: 60;
}
[data-login] .create {
margin: 1rem 0 0;
order: 70;
}
@media (min-width:992px) {
[data-login] .create {
margin: 1.5rem 0 0;
}
}
[data-login] .create p {
display: flex;
flex-direction: column;
align-items: center;
font-size: 0;
color: Transparent;
}
[data-login] .create a {}
[data-login] .accountButton,
[data-edit-signin] #createAccount {
background-color: transparent;
align-self: flex-start;
display: inline-block;
color: var(--primary);
cursor: pointer;
text-decoration: none;
text-transform: uppercase;
letter-spacing: 0.1em;
font-family: var(--text-font);
font-size: 0.75rem;
font-weight: 600;
line-height: 1;
min-height: initial;
width: initial;
border-style: solid;
border-width: 0 0 2px 0;
border-color: #D1D2D1;
padding: 0 0 0.3rem;
}
[data-login] .accountButton:hover,
[data-edit-signin] #createAccount:hover {
color: var(--primary-light);
}
/* API: Reset Password Prompt */
[data-reset] {}
[data-reset] .heading h1 {}
[data-reset] .intro {
margin-bottom: 1rem;
}
[data-reset] #cancel {
display: none;
}
/* API: Verification Steps */
[data-verification] {}
[data-verification] .VerificationControl {}
[data-verification] #emailVerificationControl_label {}
[data-verification][data-codeverified="true"] #emailVerificationControl_label {
display: none;
}
[data-verification] #emailVerificationControl_label h2 {}
[data-verification] #emailVerificationControl_label p {
font-weight: normal;
margin-bottom: 1.5rem;
}
[data-verification] .VerificationControl > .attrEntry > .helpLink {
display: none;
}
[data-verification] .verificationControlContent {
display: flex;
flex-direction: column;
align-items: stretch;
}
[data-verification] .verificationControlContent > ul {
order: 10;
}
[data-verification] .verificationInfoText,
[data-verification] .verificationSuccessText {
order: 50;
margin: 0;
}
[data-verification]:not([data-coderesent="true"]) .verificationSuccessText {
display: none;
}
[data-verification][data-codeverified="true"] .verificationSuccessText {
display: block;
}
[data-verification] .verificationInfoText > div,
[data-verification] .verificationSuccessText > div {
margin-bottom: 1.5rem;
}
[data-verification] .verificationErrorText.error {
order: 20;
margin: -0.9rem 0 1.5rem;
}
[data-verification][data-codesent="true"] .TextBox.email_li.email{
display: none !important;
}
[data-verification][data-codeverified="true"] .verificationControlContent > ul {
display: none;
}
[data-verification] .working {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #fff;
color: #fff;
height: 100vh;
width: 100vw;
opacity: 0.95;
position: fixed;
left: 0px;
top: 0px;
z-index: 1001;
font-size: 16px;
color: #191C19;
}
[data-pageerror="true"][data-verification] .working,
[data-servererror="true"][data-verification] .working {
display: none;
}
[data-verification] .working:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
position: relative;
animation: loader-uofc939by 1.5s ease infinite;
margin: 0 auto 70px auto;
border-radius: 50px;
}
[data-verification] .working:after {
color: #fff;
display: block;
content: "Please wait while we process your information.";
}
[data-verification] .working[style*="block"] {
display: flex !important;
}
[data-verification] .working:empty {
/*display: none;*/
}
[data-verification] .buttons {
order: 40;
margin-bottom: 1.5rem;
}
[data-verification][data-codeverified="true"] .verificationControlContent > .buttons {
display: none;
}
[data-verification] .buttons button {}
[data-verification] .buttons .sendCode {}
[data-verification] .buttons .verifyCode {}
[data-verification] .buttons .sendNewCode {}
[data-verification] .buttons .changeClaims {}
[data-verification] #continue {}
[data-verification][data-attemptsexceeded="true"] .sendNewCode {
display: none !important;
}
[data-verification][data-codeverified="false"] #continue {
display: none !important;
}
[data-verification] #cancel {}
[data-verification][data-codeverified="true"] #cancel,
[data-verification][data-codesent="true"] #cancel {
display: none !important;
}
[data-verification] .verificationFootnote.step-1 {
margin-top: 1.5rem;
font-size: 1rem;
}
[data-verification] .verificationFootnote.step-2 {
display: none;
}
[data-verification][data-codesent="true"] .verificationFootnote.step-2 {
display: block;
}
.newCodeSent:before {
content: "";
display: inline-block;
width: 1rem;
height: 1rem;
background-image: var(--icon-check-circle);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
margin-right: 5px;
}
.newCodeSent .subText{
color: var(--text-color-light);
font-size: 0.875rem;
}
.newCodeSent{
font-size: 0.9375rem;
}
.delay-note{
margin-top: 1rem;
display: block;
}
[data-verification] .attrEntry label {
font-size: 1rem;
color: var(--text-color-default);
}
/*forgot password error handling*/
[data-verification][data-attemptsexceeded="true"] .TextBox.VerificationCode_li.VerificationCode{
display: none !important;
}
[data-verification][data-attemptsexceeded="true"] .TextBox.email_li.email{
display: none !important;
}
[data-verification][data-attemptsexceeded="true"] .verificationFootnote.step-2{
display: none;
}
[data-verification][data-attemptsexceeded="true"] .verifyCode#emailVerificationControl_but_verify_code,
[data-verification][data-attemptsexceeded="true"] .emailVerificationControl_but_send_code,
[data-verification][data-attemptsexceeded="true"] .buttons
{
display: none !important;
}
[data-verification][data-attemptsexceeded="true"] .verificationErrorText.error {
border: 1px solid var(--validation-fail);
border-radius: 2px;
border-left-width: 4px;
margin-top: 1.5rem;
padding: 8px;
padding-left: 2.6rem;
background-position: left 1.15rem top 0.8rem;
color: var(--text-color-default);
}
[data-verification][data-codesent="false"] .sso-login-content .panel {}
@media (min-width:992px) {
[data-verification][data-codesent="false"] .sso-login-content .panel {
min-height: 35.625rem;
}
}
@media (min-width:1200px) {
[data-verification][data-codesent="false"] .sso-login-content .panel {
min-height: 32.5rem;
}
}
[data-verification][data-codesent="true"] .sso-login-content .panel {}
@media (min-width:992px) {
[data-verification][data-codesent="true"] .sso-login-content .panel {
min-height: 41.25rem;
}
.sso-login-content .panel[data-verification][data-servererror="true"][data-pageerror="true"] {
min-height: 14.625rem;
}
}
@media (min-width:1200px) {
[data-verification][data-codesent="true"] .sso-login-content .panel {
min-height: 38.75rem;
}
.sso-login-content .panel[data-verification][data-servererror="true"][data-pageerror="true"] {
min-height: 13.625rem;
}
}
[data-verification] #verifying_blurb {}
[data-verification][data-servererror="true"][data-pageerror="true"] #attributeList{
display: none;
}
[data-verification][data-servererror="true"][data-pageerror="true"] .buttons{
display: none;
}
/* API: Sign Up Dynamic */
[data-signup-email] {}
[data-signup-email] #cancel {
display: none;
}
[data-signup-email] #recaptcha-wrapper {
margin: 0 0 2rem;
}
[data-signup-email] .error.pageLevel {
margin-top: 0;
}
[data-signup-email] .g-recaptcha-response-toms_li {
visibility: hidden;
overflow: hidden;
position: absolute;
width: 1px;
height: 1px;
}
/* API: Sign Up Form */
[data-signup] .intro {
display: none;
}
[data-signup] #attributeVerification {}
[data-signup] .TextBox + .CheckboxMultiSelect {
margin-bottom: 1.5rem;
}
[data-signup] .buttons {
margin-top: 1.5rem;
}
[data-signup] .buttons #cancel {
display: none;
}
[data-signup] #attributeList > ul {
display: flex;
flex-direction: column;
align-items: stretch;
}
[data-signup] #email ~ .message {
display: none;
}
[data-signup] #email[readonly] ~ .message,
[data-signup] #email[disabled] ~ .message {
color: var(--field-note);
display: block;
}
[data-signup] .email_li { order: 10; }
[data-signup] .givenName_li { order: 20; }
[data-signup] .surname_li { order: 30; }
[data-signup] .DateTimeDropdown { order: 40; }
[data-signup] .extension_PhoneNumber_li { order: 50; }
[data-signup] .newPassword_li { order: 60; }
[data-signup] .reenterPassword_li { order: 70; }
[data-signup] .extension_IsBusinessAccount_True_li { order: 80; }
[data-signup] .sso-reasons { order: 90; }
[data-signup] .extension_ABN_li { order: 100; }
[data-signup] .extension_EntityName_li { order: 110; }
[data-signup] .extension_CompanyName_li { order: 120; }
[data-signup] .extension_BusinessType_li { order: 130; }
[data-signup] .extension_BusinessContactNumber_li { order: 140; }
[data-signup] .sso-warning { order: 150; }
[data-signup] .extension_TermsOfUseConsentChoice_AgreeToTermsOfUseConsentYes_li { order: 160; }
[data-signup] .extension_OptInMarketingConsentChoice_AgreeToMarketingConsentYes_li { order: 170; }
[data-signup]:not([data-isbusiness="true"]) #attributeList > ul > .sso-reasons,
[data-signup]:not([data-isbusiness="true"]) #attributeList > ul > .sso-warning,
[data-signup]:not([data-isbusiness="true"]) .extension_ABN_li,
[data-signup]:not([data-isbusiness="true"]) .extension_EntityName_li,
[data-signup]:not([data-isbusiness="true"]) .extension_CompanyName_li,
[data-signup]:not([data-isbusiness="true"]) .extension_BusinessType_li,
[data-signup]:not([data-isbusiness="true"]) .extension_BusinessContactNumber_li { display: none; }
[data-reset] .Password,
[data-signup] .TextBox + .Password,
[data-edit-profile] .newPasswordPlaceholder_li {
grid-template-columns: auto auto;
grid-template-rows: auto auto auto;
grid-template-areas:
"label help"
"conditions conditions"
"field field"
"strength strength"
"validation validation";
}
/* API: Re-accept Terms and Conditions */
.sso-login[data-template="dans-custom-ui-Consent"] .extension_OptInMarketingConsentChoice_li {
display: none;
}
.sso-login[data-template="dans-custom-ui-Consent"] #extension_TermsOfUseConsentChoice_label {
display: none;
}
.sso-login[data-template="dans-custom-ui-Consent"] #attributeList {
margin-bottom: 1.5rem;
}
/* API: Re-authentication */
.sso-login[data-template="dans-custom-ui-ProfileEdit-Authenticate"] {
grid-template-columns: auto;
grid-template-rows: 2.5rem auto;
grid-template-areas:
"header"
"content";
}
@media(min-width:768px) {
.sso-login[data-template="dans-custom-ui-ProfileEdit-Authenticate"] {
grid-template-columns: auto;
grid-template-rows: 4.25rem auto;
grid-template-areas:
"header"
"content";
}
.sso-login[data-template="dans-custom-ui-ProfileEdit-Authenticate"] #api {
margin-left: auto;
margin-right: auto;
}
}
.sso-login[data-template="dans-custom-ui-ProfileEdit-Authenticate"] .sso-login-content {
padding-top: 3.5rem;
}
[data-edit-signin] {}
[data-edit-signin] #localAccountForm {
display: flex;
flex-direction: column;
align-items: stretch;
}
[data-edit-signin] .intro { order: 10; }
[data-edit-signin] .error.pageLevel { order: 55; margin: 0.5rem 0 2rem; }
[data-edit-signin] .entry { display: contents; }
[data-edit-signin] .entry-item { order: 30; }
[data-edit-signin] .working { order: 40; }
[data-edit-signin] .buttons { order: 60; }
[data-edit-signin] .divider { display: none; }
[data-edit-signin] .create {
order: 50;
margin: -0.5rem 0 1.5rem;
}
[data-edit-signin] .create p {}
[data-edit-signin] #createAccount {}
/* API: Edit Profile */
[data-edit-profile] .heading {}
[data-edit-profile] .heading h1 {
color: var(--primary-dark);
background-image: var(--icon-account);
background-repeat: no-repeat;
background-position: left top;
background-size: 1.5rem;
padding-left: 2.25rem;
font-weight: 600;
padding-bottom: 0.5rem;
margin-bottom: 2rem;
border-bottom: solid 1px var(--field-border);
}
@media(min-width:768px) {
[data-edit-profile] .heading h1 {
padding-left: 2.625rem;
background-position: left top 0.1rem;
background-size: 1.75rem;
}
}
[data-edit-profile] .heading + .buttons {}
[data-edit-profile] .intro {}
[data-edit-profile] .error.pageLevel {
margin: -0.75rem 0 0.75rem;
}
[data-edit-profile] #attributeList {}
[data-edit-profile] #attributeList + .buttons {
margin-top: 2rem;
gap: 2rem 3rem;
}
@media(min-width:768px) {
[data-edit-profile] #attributeList + .buttons {
flex-direction: row;
}
}
[data-edit-profile] #attributeList > ul {
display: flex;
flex-direction: column;
align-items: stretch;
}
[data-edit-profile] #attributeList > ul > li {
margin-bottom: 1rem;
max-width: 30rem;
}
[data-edit-profile] #attributeList > ul > .heading-business {
order: 90;
margin-top: 2rem;
}
#extension_ABN {
-moz-appearance: textfield;
}
#extension_ABN::-webkit-inner-spin-button {
display: none;
-webkit-appearance: none;
}
[data-edit-profile] .givenName_li { order: 10; }
[data-edit-profile] .surname_li { order: 20; }
[data-edit-profile] .email_li { order: 30; }
[data-edit-profile] .extension_PhoneNumber_li { order: 24; }
[data-edit-profile] .extension_DateOfBirth_li { order: 22; }
[data-edit-profile] .extension_Gender_li { order: 60; display: none; }
[data-edit-profile] .newPasswordPlaceholder_li { order: 40; }
[data-edit-profile] .reenterPasswordPlaceholder_li { order: 50; }
[data-edit-profile] .extension_IsBusinessAccount_True_li { order: 80; }
[data-edit-profile] .extension_ABN_li { order: 100; }
[data-edit-profile] .extension_EntityName_li { order: 110; }
[data-edit-profile] .extension_CompanyName_li { order: 120; }
[data-edit-profile] .extension_BusinessType_li { order: 130; }
[data-edit-profile] .extension_BusinessContactNumber_li { order: 140; }
[data-edit-profile] .extension_TermsOfUseConsentChoice_li { order: 160; }
[data-edit-profile] .extension_OptInMarketingConsentChoice_li { order: 170; }
[data-edit-profile="personal"] .heading-business,
[data-edit-profile="personal"] .extension_ABN_li,
[data-edit-profile="personal"] .extension_EntityName_li,
[data-edit-profile="personal"] .extension_CompanyName_li,
[data-edit-profile="personal"] .extension_BusinessType_li,
[data-edit-profile="personal"] .extension_BusinessContactNumber_li { display: none; }
[data-edit-entrance="business"] .givenName_li,
[data-edit-entrance="business"] .surname_li,
[data-edit-entrance="business"] .email_li,
[data-edit-entrance="business"] .extension_PhoneNumber_li,
[data-edit-entrance="business"] .extension_DateOfBirth_li,
[data-edit-entrance="business"] .extension_Gender_li,
[data-edit-entrance="business"] .newPasswordPlaceholder_li,
[data-edit-entrance="business"] .reenterPasswordPlaceholder_li { display: none; }
[data-edit-entrance="personal"] .heading-business,
[data-edit-entrance="personal"] .extension_ABN_li,
[data-edit-entrance="personal"] .extension_EntityName_li,
[data-edit-entrance="personal"] .extension_CompanyName_li,
[data-edit-entrance="personal"] .extension_BusinessType_li,
[data-edit-entrance="personal"] .extension_BusinessContactNumber_li { display: none; }
[data-edit-profile] #continue {}
[data-edit-profile] #cancel {}
/* loader component */
.loader {
text-align: center;
position: relative;
}
.loader--overlay {
position: absolute;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
flex-direction: column;
opacity: 0.95;
top: 0;
z-index: 99;
left: 0;
}
.loader--sticky-overlay {
position: fixed;
width: 100%;
height: 100%;
top: 50%;
display: flex;
justify-content: center;
align-items: center;
background-color: #fff;
flex-direction: column;
opacity: 0.95;
top: 0;
z-index: 99;
left: 0;
}
.loader__logo {
position: fixed;
width: 18px;
height: 18px;
position: relative;
animation: loader-uofc939b9 1.5s ease infinite;
margin: 0 auto 61px auto;
border-radius: 50px;
}
@keyframes loader-uofc939b9 {
0%,
100% {
box-shadow: -14px 18px 0 #4c8251, 14px 18px 0 rgba(76, 130, 81, 0.7), 14px 46px 0 rgba(76, 130, 81, 0.4), -14px 46px 0 transparent;
}
25% {
box-shadow: -14px 18px 0 transparent, 14px 18px 0 #4c8251, 14px 46px 0 rgba(76, 130, 81, 0.7), -14px 46px 0 rgba(76, 130, 81, 0.4);
}
50% {
box-shadow: -14px 18px 0 rgba(76, 130, 81, 0.4), 14px 18px 0 transparent, 14px 46px 0 #4c8251, -14px 46px 0 rgba(76, 130, 81, 0.7);
}
75% {
box-shadow: -14px 18px 0 rgba(76, 130, 81, 0.7), 14px 18px 0 rgba(76, 130, 81, 0.4), 14px 46px 0 transparent, -14px 46px 0 #4c8251;
}
}
.loader__logo--xs {
width: 9px;
height: 9px;
position: relative;
animation: loader-uofc939be 1.5s ease infinite;
margin: 0 auto 38px auto;
border-radius: 50px;
}
@keyframes loader-uofc939be {
0%,
100% {
box-shadow: -7px 9px 0 #4c8251, 7px 9px 0 rgba(76, 130, 81, 0.7), 7px 23px 0 rgba(76, 130, 81, 0.4), -7px 23px 0 transparent;
}
25% {
box-shadow: -7px 9px 0 transparent, 7px 9px 0 #4c8251, 7px 23px 0 rgba(76, 130, 81, 0.7), -7px 23px 0 rgba(76, 130, 81, 0.4);
}
50% {
box-shadow: -7px 9px 0 rgba(76, 130, 81, 0.4), 7px 9px 0 transparent, 7px 23px 0 #4c8251, -7px 23px 0 rgba(76, 130, 81, 0.7);
}
75% {
box-shadow: -7px 9px 0 rgba(76, 130, 81, 0.7), 7px 9px 0 rgba(76, 130, 81, 0.4), 7px 23px 0 transparent, -7px 23px 0 #4c8251;
}
}
.loader__logo--sm {
width: 12px;
height: 12px;
position: relative;
animation: loader-uofc939bm 1.5s ease infinite;
margin: 0 auto 47px auto;
border-radius: 50px;
}
@keyframes loader-uofc939bm {
0%,
100% {
box-shadow: -10px 12px 0 #4c8251, 10px 12px 0 rgba(76, 130, 81, 0.7), 10px 32px 0 rgba(76, 130, 81, 0.4), -10px 32px 0 transparent;
}
25% {
box-shadow: -10px 12px 0 transparent, 10px 12px 0 #4c8251, 10px 32px 0 rgba(76, 130, 81, 0.7), -10px 32px 0 rgba(76, 130, 81, 0.4);
}
50% {
box-shadow: -10px 12px 0 rgba(76, 130, 81, 0.4), 10px 12px 0 transparent, 10px 32px 0 #4c8251, -10px 32px 0 rgba(76, 130, 81, 0.7);
}
75% {
box-shadow: -10px 12px 0 rgba(76, 130, 81, 0.7), 10px 12px 0 rgba(76, 130, 81, 0.4), 10px 32px 0 transparent, -10px 32px 0 #4c8251;
}
}
.loader__logo--md {
width: 18px;
height: 18px;
position: relative;
animation: loader-uofc939bv 1.5s ease infinite;
margin: 0 auto 61px auto;
border-radius: 50px;
}
@keyframes loader-uofc939bv {
0%,
100% {
box-shadow: -14px 18px 0 #4c8251, 14px 18px 0 rgba(76, 130, 81, 0.7), 14px 46px 0 rgba(76, 130, 81, 0.4), -14px 46px 0 transparent;
}
25% {
box-shadow: -14px 18px 0 transparent, 14px 18px 0 #4c8251, 14px 46px 0 rgba(76, 130, 81, 0.7), -14px 46px 0 rgba(76, 130, 81, 0.4);
}
50% {
box-shadow: -14px 18px 0 rgba(76, 130, 81, 0.4), 14px 18px 0 transparent, 14px 46px 0 #4c8251, -14px 46px 0 rgba(76, 130, 81, 0.7);
}
75% {
box-shadow: -14px 18px 0 rgba(76, 130, 81, 0.7), 14px 18px 0 rgba(76, 130, 81, 0.4), 14px 46px 0 transparent, -14px 46px 0 #4c8251;
}
}
.loader__logo--md + .loader__text {
font-size: 20px;
}
.loader__logo--lg {
width: 20px;
height: 20px;
position: relative;
animation: loader-uofc939by 1.5s ease infinite;
margin: 0 auto 70px auto;
border-radius: 50px;
}
@keyframes loader-uofc939by {
0%,
100% {
box-shadow: -17.5px 20px 0 #4c8251, 17.5px 20px 0 rgba(76, 130, 81, 0.7), 17.5px 55px 0 rgba(76, 130, 81, 0.4), -17.5px 55px 0 transparent;
}
25% {
box-shadow: -17.5px 20px 0 transparent, 17.5px 20px 0 #4c8251, 17.5px 55px 0 rgba(76, 130, 81, 0.7), -17.5px 55px 0 rgba(76, 130, 81, 0.4);
}
50% {
box-shadow: -17.5px 20px 0 rgba(76, 130, 81, 0.4), 17.5px 20px 0 transparent, 17.5px 55px 0 #4c8251, -17.5px 55px 0 rgba(76, 130, 81, 0.7);
}
75% {
box-shadow: -17.5px 20px 0 rgba(76, 130, 81, 0.7), 17.5px 20px 0 rgba(76, 130, 81, 0.4), 17.5px 55px 0 transparent, -17.5px 55px 0 #4c8251;
}
}
.loader__logo--lg + .loader__text {
font-size: 20px;
}
.loader__text {
font-size: 16px;
color: #cccccc;
}
/*start of edit profile - otp verification*/
[data-edit-verification][data-codeverified="true"] #emailVerificationControl-profileEditOTP_label,
[data-edit-verification][data-codeverified="true"] #emailVerificationControl-profileEditOTPUpdate_label {
display: none;
}
[data-edit-verification] #emailVerificationControl-profileEditOTP_label p,
[data-edit-verification] #emailVerificationControl-profileEditOTPUpdate_label p {
font-weight: normal;
margin-bottom: 1.5rem;
}
[data-edit-verification] .VerificationControl > .attrEntry > .helpLink {
display: none;
}
[data-edit-verification] .verificationControlContent {
display: flex;
flex-direction: column;
align-items: stretch;
}
[data-edit-verification] .verificationControlContent > ul {
order: 10;
}
[data-edit-verification] .verificationInfoText,
[data-edit-verification] .verificationSuccessText {
order: 50;
margin: 0;
}
[data-edit-verification]:not([data-coderesent="true"]) .verificationSuccessText {
display: none;
}
[data-edit-verification][data-codeverified="true"] .verificationSuccessText {
display: block;
}
[data-edit-verification] .verificationInfoText > div,
[data-edit-verification] .verificationSuccessText > div {
margin-bottom: 1.5rem;
}
[data-edit-verification] .verificationErrorText.error {
order: 20;
margin: -0.9rem 0 1.5rem;
@media (min-width:992px) {
margin: -1.5rem 0 1.5rem;
}
}
[data-edit-verification][data-codesent="true"] .TextBox.email_li.email{
display: none !important;
}
[data-edit-verification][data-codeverified="true"] .verificationControlContent > ul {
display: none;
}
[data-edit-verification] .working {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #fff;
color: #fff;
height: 100vh;
width: 100vw;
opacity: 0.95;
position: fixed;
left: 0px;
top: 0px;
z-index: 1001;
font-size: 16px;
color: #191C19;
}
[data-edit-verification][data-pageerror="true"] .working,
[data-edit-verification][data-servererror="true"] .working {
display: none;
}
[data-edit-verification] .working:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
position: relative;
animation: loader-uofc939by 1.5s ease infinite;
margin: 0 auto 70px auto;
border-radius: 50px;
}
[data-edit-verification] .working:after {
color: #fff;
display: block;
content: "Please wait while we process your information.";
}
[data-edit-verification] .working[style*="block"] {
display: flex !important;
}
[data-edit-verification] .working:empty {
/*display: none;*/
}
[data-edit-verification] .buttons {
order: 40;
margin-bottom: 1.5rem;
}
[data-edit-verification][data-codeverified="true"] .verificationControlContent > .buttons {
display: none;
}
[data-edit-verification] .buttons .changeClaims {
display: none!important;
}
[data-edit-verification][data-attemptsexceeded="true"] .sendNewCode,
[data-edit-verification][data-verifyerror="true"] .sendNewCode {
display: none !important;
}
[data-edit-verification] .buttons .verifyCode#emailVerificationControl-profileEditOTP_but_verify_code,
[data-edit-verification] .buttons .verifyCode#emailVerificationControl-profileEditOTPUpdate_but_verify_code {
margin-top: -4.5rem;
}
[data-edit-verification][data-attemptsexceeded="true"] .verifyCode#emailVerificationControl-profileEditOTP_but_verify_code,
[data-edit-verification][data-verifyerror="true"] .verifyCode#emailVerificationControl-profileEditOTP_but_verify_code,
[data-edit-verification][data-attemptsexceeded="true"] .verifyCode#emailVerificationControl-profileEditOTPUpdate_but_verify_code,
[data-edit-verification][data-verifyerror="true"] .verifyCode#emailVerificationControl-profileEditOTPUpdate_but_verify_code {
display: none !important;
}
[data-edit-verification][data-codeverified="false"] #continue{
display: none !important;
}
[data-edit-verification] #cancel,
[data-edit-verification][data-codeverified="true"] #cancel,
[data-edit-verification][data-codesent="true"] #cancel {
display: none !important;
}
[data-edit-verification] .verificationFootnote.step-1 {
margin-top: 1.5rem;
font-size: 1rem;
}
[data-edit-verification] .verificationFootnote.signup-step-1{
font-size: 1rem;
}
[data-edit-verification] .verificationFootnote.step-2,
[data-edit-verification] .verificationFootnote.signup-step-2 {
display: none;
}
[data-edit-verification][data-codesent="true"] .verificationFootnote.step-2,
[data-edit-verification][data-codesent="true"] .verificationFootnote.signup-step-2 {
display: block;
font-size: 1rem;
}
[data-edit-verification][data-codesent="true"] .verificationFootnote.signup-step-2{
margin-top: 1.5rem;
}
[data-edit-verification][signup-email] .verificationFootnote.step-1,
[data-edit-verification][signup-email] .verificationFootnote.step-2{
display: none;
}
@media (min-width:992px) {
.sso-login-content .panel[data-edit-verification] {
min-height: 35.625rem;
}
.sso-login-content .panel[data-edit-verification][data-codesent="false"] {
min-height: 35.625rem;
}
.sso-login-content .panel[data-edit-verification][data-codesent="true"] {
min-height: 41.25rem;
}
.sso-login-content .panel[data-edit-verification][data-attemptsexceeded="true"],
.sso-login-content .panel[data-edit-verification][data-verifyerror="true"] {
min-height: 22.625rem;
}
}
@media (min-width:1200px) {
.sso-login-content .panel[data-edit-verification] {
min-height: 35.625rem;
}
.sso-login-content .panel[data-edit-verification][data-codesent="false"] {
min-height: 32.5rem;
}
.sso-login-content .panel[data-edit-verification][data-codesent="true"] {
min-height: 38.75rem;
}
.sso-login-content .panel[data-edit-verification][data-attemptsexceeded="true"],
.sso-login-content .panel[data-edit-verification][data-verifyerror="true"] {
min-height: 17.625rem;
}
}
[data-edit-verification][data-attemptsexceeded="true"] .TextBox.VerificationCode_li.VerificationCode,
[data-edit-verification][data-verifyerror="true"] .TextBox.VerificationCode_li.VerificationCode {
display: none !important;
}
[data-edit-verification][data-attemptsexceeded="true"] .verificationErrorText.error,
[data-edit-verification][data-verifyerror="true"] .verificationErrorText.error {
border: 1px solid #AF0016;
border-radius: 2px;
border-left-width: 4px;
margin-top: 1.5rem;
padding: 8px;
padding-left: 2.6rem;
background-position: left 1.15rem top 0.8rem;
color: #191C19;
}
[data-edit-verification][data-attemptsexceeded="true"] .verificationFootnote.step-1,
[data-edit-verification][data-verifyerror="true"] .verificationFootnote.step-1,
[data-edit-verification][data-attemptsexceeded="true"] .verificationFootnote.signup-step-1,
[data-edit-verification][data-verifyerror="true"] .verificationFootnote.signup-step-1 {
margin-top: -4.5rem;
}
[data-edit-verification][data-attemptsexceeded="true"] .verificationFootnote.step-2,
[data-edit-verification][data-verifyerror="true"] .verificationFootnote.step-2,
[data-edit-verification][data-attemptsexceeded="true"] .verificationFootnote.signup-step-2,
[data-edit-verification][data-verifyerror="true"] .verificationFootnote.signup-step-2
{
display: none;
}
[data-edit-verification] #emailVerificationControl-profileEditOTP_error_message[data-doubleerror="true"][data-generationexceeded="false"],
[data-edit-verification] #emailVerificationControl-profileEditOTPUpdate_error_message[data-doubleerror="true"][data-generationexceeded="false"] {
display: none !important;
}
[data-edit-verification] #emailVerificationControl-profileEditOTP_error_message a,
[data-edit-verification] #emailVerificationControl-profileEditOTPUpdate_error_message a{
color: #5E605E;
}
[data-edit-verification] .havingTrouble,
[data-verification][data-codesent="true"] .havingTrouble {
margin-bottom: 1.5rem;
order: 30;
font-size: 1rem;
margin-top: -1rem;
}
[data-verification][data-codesent="false"] .havingTrouble {
display: none;
}
[data-edit-verification] .sendNewCode,
[data-verification] .sendNewCode {
display: none !important;
}
[data-edit-verification] .resendCode,
[data-verification] .resendCode {
color: var(--primary);
font-weight: 600;
text-decoration: underline;
cursor: pointer;
}
[data-edit-verification][data-attemptsexceeded="true"] .havingTrouble,
[data-edit-verification][data-retriesexceeded="true"] .havingTrouble,
[data-edit-verification][data-verifyerror="true"] .havingTrouble,
[data-edit-verification][data-generationexceeded="true"] .havingTrouble,
[data-verification][data-attemptsexceeded="true"] .havingTrouble,
[data-verification][data-retriesexceeded="true"] .havingTrouble,
[data-verification][data-verifyerror="true"] .havingTrouble,
[data-verification][data-generationexceeded="true"] .havingTrouble
{
display: none !important;
}
[data-edit-verification] .mfaHeading,
[data-verification] .mfaHeading{
color: var(--text-color-default);
}
[data-edit-verification] .mfaHeading + p,
[data-verification] .mfaHeading + p{
font-weight: 400 !important;
font-size: 1rem;
color: var(--text-color) !important;
}
[data-edit-verification] .attrEntry label{
font-size: 1rem;
color: #191C19;
}
/*end of edit profile - otp verification*/
/**Dans SMS Verification:: data-sms-verification - start */
[data-sms-verification] .working {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-color: #fff;
color: #fff;
height: 100vh;
width: 100vw;
opacity: 0.95;
position: fixed;
left: 0px;
top: 0px;
z-index: 1001;
font-size: 16px;
color: #191C19;
}
[data-sms-verification][data-pageerror="true"] .working,
[data-sms-verification][data-servererror="true"] .working {
display: none;
}
[data-sms-verification] .working:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
position: relative;
animation: loader-uofc939by 1.5s ease infinite;
margin: 0 auto 70px auto;
border-radius: 50px;
}
[data-sms-verification] .working:after {
color: #fff;
display: block;
content: "Please wait while we process your information.";
}
[data-sms-verification] .working[style*="block"] {
display: flex !important;
}
[data-sms-verification] .working:empty {
/*display: none;*/
}
[data-sms-verification] .phoneVerificationControl_li li.countryCode_li,
[data-sms-verification] .phoneVerificationControlNoPrefil_li li.countryCode_li,
[data-sms-verification] .phoneVerificationControl-forProfileEdit_li li.countryCode_li
{
display: none!important;
}
[data-sms-verification][data-codesent="false"] .phoneVerificationControl_li li.extension_PhoneNumber_li,
[data-sms-verification][data-codesent="false"] .phoneVerificationControlNoPrefil_li li.extension_PhoneNumber_li,
[data-sms-verification][data-codesent="false"] .phoneVerificationControl-forProfileEdit_li li.extension_PhoneNumber_li
{
margin-top: 1.5rem;
}
[data-sms-verification][data-codesent="true"] .phoneVerificationControl_li li.extension_PhoneNumber_li,
[data-sms-verification][data-codesent="true"] .phoneVerificationControlNoPrefil_li li.extension_PhoneNumber_li,
[data-sms-verification][data-codesent="true"] .phoneVerificationControl-forProfileEdit_li li.extension_PhoneNumber_li
{
display: none!important;
}
[data-sms-verification]:not([data-coderesent="true"]) .verificationSuccessText {
visibility: hidden;
}
[data-sms-verification][data-codeverified="true"] .verificationSuccessText {
display: block;
}
[data-sms-verification] .verificationInfoText > div,
[data-sms-verification] .verificationSuccessText > div {
/*margin-bottom: 1.5rem;*/
visibility: hidden;
}
[data-sms-verification] #cancel {}
[data-sms-verification][data-codeverified="true"] #cancel,
[data-sms-verification][data-codesent="true"] #cancel {
display: none !important;
}
[data-sms-verification] .verificationFootnote.step-1 {
margin-top: 1.5rem;
}
[data-sms-verification] #phoneVerificationControl,
[data-sms-verification] #phoneVerificationControlNoPrefil,
[data-sms-verification] #phoneVerificationControl-forProfileEdit
{
display: flex;
flex-direction: column;
position: relative;
}
[data-sms-verification] .error.pageLevel {
order: 20;
margin: 0.5rem 0 2rem;
}
[data-sms-verification] .verificationInfoText,
[data-sms-verification] .verificationSuccessText {
order: 50;
margin: 0;
height: 0;
}
[data-sms-verification] .verificationErrorText.error {
order: 30;
margin: -0.9rem 0 1.5rem;
@media (min-width:992px) {
margin: -1.5rem 0 1.5rem;
}
}
[data-sms-verification] #phoneVerificationControl > .buttons,
[data-sms-verification] #phoneVerificationControlNoPrefil > .buttons,
[data-sms-verification] #phoneVerificationControl-forProfileEdit > .buttons
{
order: 40;
}
[data-sms-verification] #attributeVerification > .buttons {
order: 50;
display: none;
}
[data-sms-verification][data-codesent="true"] .changeClaims{
display: inline-flex !important;
}
[data-sms-verification][data-prefil-sms-verification][data-codesent="true"] .changeClaims{
display: none !important;
}
[data-sms-verification][data-codesent="false"] .havingTrouble{
display: none;
}
[data-sms-verification][data-codesent="true"] .havingTrouble{
margin-bottom: 1.5rem;
order: 30;
font-size: 1rem;
margin-top: -1rem;
}
[data-sms-verification] .sendNewCode{
display: none !important;
}
[data-sms-verification] .resendCode{
color: var(--primary);
font-weight: 600;
text-decoration: underline;
cursor: pointer;
}
/*error handling*/
[data-sms-verification][data-attemptsexceeded="true"] .havingTrouble,
[data-sms-verification][data-attemptsexceeded="true"] .buttons,
[data-sms-verification][data-attemptsexceeded="true"] .phoneNumberInput,
[data-sms-verification][data-attemptsexceeded="true"] .VerificationCode,
[data-sms-verification][data-retriesexceeded="true"] .havingTrouble,
[data-sms-verification][data-retriesexceeded="true"] .buttons,
[data-sms-verification][data-retriesexceeded="true"] .phoneNumberInput,
[data-sms-verification][data-retriesexceeded="true"] .VerificationCode
{
display: none !important;
}
[data-sms-verification][data-attemptsexceeded="true"] .verificationErrorText {
border: 1px solid var(--validation-fail);
border-radius: 2px;
border-left-width: 4px;
margin-top: 1.5rem;
padding: 8px;
padding-left: 2.6rem;
background-position: left 1.15rem top 0.8rem;
color: #191C19;
}
[data-sms-verification] #phoneVerificationControl_error_message[data-doubleerror="true"][data-attemptsexceeded="false"],
[data-sms-verification] #phoneVerificationControlNoPrefil_error_message[data-doubleerror="true"][data-attemptsexceeded="false"],
[data-sms-verification] #phoneVerificationControl-forProfileEdit_error_message[data-doubleerror="true"][data-attemptsexceeded="false"]
{
display: none !important;
}
[data-sms-verification] .mobileFootnote{
font-weight: 400 !important;
color: var(--text-color);
}
[data-sms-verification] .mfaHeading{
color: #191C19;
}
[data-sms-verification] .mfaHeading + p{
font-weight: 400 !important;
font-size: 1rem;
color: var(--text-color) !important;
}
[data-sms-verification] .attrEntry label{
font-size: 1rem;
color: #191C19;
}
[data-sms-verification] #VerificationCode_label{
margin-top: 2rem;
}
/*error handling*/
[data-sms-verification][signup-mobile][data-attemptsexceeded="true"] .buttons,
[data-sms-verification][signup-mobile][data-retriesexceeded="true"] .buttons,
[data-sms-verification][edit-mobile][data-attemptsexceeded="true"] .buttons,
[data-sms-verification][edit-mobile][data-retriesexceeded="true"] .buttons
{
display: none !important;
}
/*removing back button profile edit email on error*/
[data-edit-verification][edit-email][data-attemptsexceeded="true"] #cancel,
[data-edit-verification][edit-email][data-retriesexceeded="true"] #cancel,
[data-edit-verification][signup-email][data-attemptsexceeded="true"] #cancel,
[data-edit-verification][signup-email][data-retriesexceeded="true"] #cancel
{
display: none !important;
}
/*edit mobile*/
[data-sms-verification][edit-mobile] #cancel,
[data-sms-verification][edit-mobile] #attributeVerification > .buttons
{
display: flex !important;
margin-top: 10px;
}
[data-sms-verification][edit-mobile] #continue
{
display: none;
}
[data-sms-verification][edit-mobile][data-codesent="true"] .changeClaims{
display: none !important;
}
[data-sms-verification][edit-mobile][data-attemptsexceeded="true"] #attributeVerification > .buttons,
[data-sms-verification][edit-mobile][data-retriesexceeded="true"] #attributeVerification > .buttons
{
display: none !important;
}
/*edit email*/
[data-edit-verification][edit-email] #cancel{
display: flex !important;
}
[data-sms-verification][signup-mobile] .laterText{
margin-top: 1rem;
}
@media (min-width:992px) {
.sso-login-content .panel[data-sms-verification] {
min-height: 29.5rem;
}
.sso-login-content .panel[data-sms-verification][data-attemptsexceeded="true"],
.sso-login-content .panel[data-sms-verification][data-verifyerror="true"] {
min-height: 22.625rem;
}
[data-sms-verification] .sendCode{
max-width: 18.95rem !important;
padding: 0 1.5rem;
}
}
@media (min-width:1200px) {
.sso-login-content .panel[data-sms-verification] {
min-height: 29.5rem;
}
.sso-login-content .panel[data-sms-verification][data-attemptsexceeded="true"],
.sso-login-content .panel[data-sms-verification][data-verifyerror="true"] {
min-height: 22.625rem;
}
}
/**Dans SMS Verification:: data-sms-verification - end */