@charset "UTF-8";
/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
html {
    line-height: 1.15;
    /* 1 */
    -webkit-text-size-adjust: 100%;
    /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */
body {
    margin: 0;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
    box-sizing: content-box;
    /* 1 */
    height: 0;
    /* 1 */
    overflow: visible;
    /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
a {
    background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
    border-bottom: none;
    /* 1 */
    text-decoration: underline;
    /* 2 */
    text-decoration: underline dotted;
    /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
    font-family: monospace, monospace;
    /* 1 */
    font-size: 1em;
    /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */
small {
    font-size: 12px;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
img {
    border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 1 */
    line-height: 1.15;
    /* 1 */
    margin: 0;
    /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
button,
input {
    /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
    /* 1 */
    text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

    /**
 * Remove the inner border and padding in Firefox.
 */
    button::-moz-focus-inner,
    [type="button"]::-moz-focus-inner,
    [type="reset"]::-moz-focus-inner,
    [type="submit"]::-moz-focus-inner {
        border-style: none;
        padding: 0;
    }

    /**
 * Restore the focus styles unset by the previous rule.
 */
    button:-moz-focusring,
    [type="button"]:-moz-focusring,
    [type="reset"]:-moz-focusring,
    [type="submit"]:-moz-focusring {
        outline: 1px dotted ButtonText;
    }

/**
 * Correct the padding in Firefox.
 */
fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
    box-sizing: border-box;
    /* 1 */
    color: inherit;
    /* 2 */
    display: table;
    /* 1 */
    max-width: 100%;
    /* 1 */
    padding: 0;
    /* 3 */
    white-space: normal;
    /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
    vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type="search"] {
    -webkit-appearance: textfield;
    /* 1 */
    outline-offset: -2px;
    /* 2 */
}

    /**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
    [type="search"]::-webkit-search-decoration {
        -webkit-appearance: none;
    }

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
    -webkit-appearance: button;
    /* 1 */
    font: inherit;
    /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
details {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
    display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
template {
    display: none;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
    display: none;
}

#placeHolder {
    outline: 0;
}

/*Remove arrows from input type number*/
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

input[type=number] {
    -moz-appearance: textfield; /* Firefox */
}

/* Fix for Firefox and IE (IDP-5560), we need to force a width because is being putted inline from the BE code */
#ContentPlaceHolder1_table1 {
    width: auto !important;
}

.hidden {
    display: none;
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_reqValPassword, .reqValNewPassword {
    display: none !important;
}

table {
    margin: auto;
}

a {
    color: #1959d6;
    cursor: pointer;
    text-decoration: none;
    font-family: "Open Sans",Helvetica,Arial,sans-serif;
    font-stretch: normal;
    font-style: normal;
    font-size: 16px;
    font-weight: normal;
}

a:hover {
    text-decoration: underline;
}

label.disabled {
    color: #a6b5ba !important;
}

input[type="submit"], input[type="button"], button[type="button"] {
    height: 40px;
    width: auto;
    min-width: 101px;
    background-color: #2A81D1;
    color: #FFFFFF;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
    text-align: center;
    border-style: none;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
    cursor: pointer;
}

input[type="submit"]:focus, input[type="button"]:focus {
    text-decoration: none;
    box-shadow: 0 2px 4px 0 #2A81D1;
}

input[type="submit"]:disabled {
    background-color: #eff2f3;
    border-color: #eff2f3;
    color: #727e83;
}

input[type="text"]:disabled {
    background-color: #eff2f3;
    border-color: #eff2f3;
    color: #222222;
    opacity: 0.7;
}

input[type="text"], input[type="password"] {
    border-color: #A6B5BA;
    border-style: solid;
    padding: 12px 8px;
    border-width: 1px;
    box-sizing: border-box;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    margin: 0;
    outline: none;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    width: 100%
}

input[type="text"]:focus, input[type="password"]:focus {
    border: 1px solid #2A81D1;
}



body {
    width: 100% !important;
    background: url(BG.png) no-repeat;
    background-size: cover;
}

#LogoImage {
    display: block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 180px;
    margin: auto;
}

#lblTop {
    color: #0c2028;
    font-size: 16px;
}

.lblDisclaimer {
    font-size: 12px;
    line-height: 3;
}

span {
   font-family: "Open Sans", Helvetica, Arial, sans-serif;
}

/* PasswordView Specific CSS*/
#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 {
    width: 100%;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 tbody tr td span {
    color: #191c1d;
    display: block;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1;
    margin: 5px 0;
    font-weight: bold;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 #ContentPlaceHolder1_MFALoginControl1_PasswordView_compValPassword,
#ContentPlaceHolder1_MFALoginControl1_UserIDView_compValPassword {
    margin-top: 4px;
    display: block;
    color: #D20F0F;
    font-size: 16px;
    line-height: 24px;
    background-image: url(./error-icon.svg);
    background-repeat: no-repeat;
    background-size: 16px;
    padding-left: 24px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: normal;
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_tbxNewPassword1 {
    margin-bottom: 5px;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_trPwdExpireMsg {
    height: 72px;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 tbody tr td.tcPwdExpireMsg {
    background-color: #fae7e7;
    border-color: #d20f0f;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    color: #191c1d;
    display: table;
    padding: 8px 8px 8px 15px;
    transition: opacity 1s;
    width: 100%;
    transition: opacity 1s;
    font-weight: normal;
    background-image: url(./error-icon.svg);
    background-repeat: no-repeat;
    background-size: 18px;
    background-position: 8px;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 tbody tr td span.field-error {
    font-weight: normal;
    background-image: none;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 tbody td {
    display: block;
}

#ContentPlaceHolder1_MFALoginControl1_PasswordView_container1 tbody td input {
    width: 100%;
}

.content-buttons {
    text-align: center;
    max-width: none !important;
    margin-top: 8px;
}

.content-instructions {
    text-align: left;
    padding-top: 10px;
    box-sizing: border-box;
    font-size: 12px;
}

.content-instructions #ContentPlaceHolder1_MFALoginControl1_PasswordView_trlblKiosk,
.content-instructions #ContentPlaceHolder1_MFALoginControl1_PasswordView_trrblKiosk {
    font-size: 12px;
    font-weight: bold;
}

.content-instructions #ContentPlaceHolder1_MFALoginControl1_PasswordView_trrblKiosk span {
    display: block;
}

.content-instructions table {
    margin: 0;
}

/*Login Page specific CSS*/
.radiobutton, .checkbutton {
    position: relative;
    display: inline-block;
    padding: 5px 0;
    width: auto;
    padding-left: 18px;
}

.radiobutton::before, .checkbutton::after {
    clear: both;
}

.radiobutton > input,
.checkbutton > input {
    position: absolute;
    top: 6px;
    left: 0;
    font-size: 14px;
}

.radiobutton > label,
.checkbutton > label {
    cursor: pointer;
    font-weight: normal;
    line-height: 18px;
    min-height: 18px;
}

.username-block > .bodytext {
    color: #191c1d;
    display: block;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1;
    margin: 0;
    margin: 5px 0;
    font-weight: bold;
}

.submit-button-block, .header-block {
    text-align: center;
}

.header-block > span {
    display: block;
}

.header-legend > span {
    display: block;
    font-size: 12px;
    line-height: 1.25
}

.custom-padding {
    padding: 5px 0;
}

.sa-toast-destructive {
    width: 25%;
    top: 0%;
    position: fixed;
    margin: 5% auto;
    left: 0;
    right: 0;
}

.separetor {
    border-bottom: 2px solid #cfd7da;
    padding-bottom: 25px;
    width: 80%;
    margin: auto;
}

.separetor-top {
    border-top: 2px solid #cfd7da;
    margin-top: 16px;
    padding-bottom: 20px;
    width: 80%;
    margin: auto
}

.user-id-view-container > .login-header {
    padding-bottom: 8px;
}

.user-id-view-container, .content-footer {
    background-color: rgba(255,255,255,0.9);
    width: 340px;
    position: relative;
    margin: auto;
    box-shadow: 0 16px 24px 0 rgba(0,0,0,0.1);
    box-sizing: border-box;
    padding: 10px 20px;
    display: block;
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_lblAfterBtn {
    display: none;
}

.correct-padding {
    padding-left: 4px;
    margin-top: -6px;
}

.login-links, #CopyrightText {
    text-align: center;
}

.login-links > a, #Small1 > a {
    display: block;
}

#Small1 > a {
    font-size: 12px;
}

#sociallogin > div > ul {
    list-style: none;
    padding: 0;
    text-align: center;
}

#sociallogin > div > ul > li {
    display: inline-block;
    width: 45%;
}

#sociallogin > div > ul > li:nth-child(odd) {
    margin-right: 8px;
}

#sociallogin > div > ul > li:last-child {
    margin-right: 0px;
}

#sociallogin > div > ul > li:last-child > a {
    margin-bottom: 0px;
}

#sociallogin > div > ul > li:only-child {
    width: 100%;
}

#sociallogin > div > ul a {
    display: block;
    text-decoration: none;
    color: black;
    font-weight: bold;
    line-height: 30px;
    text-align: left;
    background-color: #EFF2F3;
    border-color: #cfd7da;
    padding: 5px 0 5px 45px;
    box-sizing: border-box;
    margin-bottom: 10px;
    position: relative;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}

#sociallogin > div > ul a:before {
    content: '';
    background-size: cover;
    width: 25px;
    height: 25px;
    position: absolute;
    left: 8px;
    top: 20%;
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_lkbFacebook:before {
    background: url('fblogo.png');
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_lkbGoogle:before {
    background: url('glogo.png');
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_lkbLinkedin:before {
    background: url('linklogo.png')
}

#ContentPlaceHolder1_MFALoginControl1_UserIDView_lkbLive:before {
    background: url('livelogo.png')
}

/* password expired error */
#ContentPlaceHolder1_MFALoginControl1_UserIDView_lblPasswordExpireMsg {
    display: block;
    cursor: pointer;
    background-color: #fae7e7;
    border: 1px solid #d20f0f;
    border-radius: 3px;
    text-align: center;
    padding: 12px 0px 8px 0px;
    margin-bottom: 16px;
}
#ContentPlaceHolder1_MFALoginControl1_UserIDView_lblPasswordExpireMsg > span{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23d20f0f'%3E%3Cdefs%3E%3Cpath d='M12.894 2.553l9 18A1 1 0 0 1 21 22H3a1 1 0 0 1-.894-1.447l9-18a1 1 0 0 1 1.788 0zM4.618 20h14.764L12 5.236 4.618 20zm7.383-1a1 1 0 1 1-.002-2A1 1 0 0 1 12 19zM13 15a1 1 0 0 1-2 0v-4a1 1 0 0 1 2 0v4z' id='a'/%3E%3C/defs%3E%3Cmask id='b' fill='%23fff'%3E%3Cuse xlink:href='%23a'/%3E%3C/mask%3E%3Cg mask='url(%23b)'%3E%3Cpath d='M0 0h28v28H0z'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 26px;
    background-position: 8px center;
    text-align: center;
    padding: 12px 8px 8px 40px;
}

/* Active X view specific css */
.installactivexwidth {
    width: 70%;
    margin: auto;
}

#ContentPlaceHolder1_Label1, #ContentPlaceHolder1_Panel2 {
    max-width: none;
    width: 100% !important;
}

/* AcceptDenyWaitingView*/

#ContentPlaceHolder1_MFALoginControl1_AcceptDenyWaitingView_lblHeader.accept-title,
#ContentPlaceHolder1_MFALoginControl1_RegistrationMethodView_lblHeader1.multi-factor-throttle-message {
    margin-top: 4px;
    display: block;
    color: #D20F0F;
    font-size: 16px;
    line-height: 24px;
    background-image: url(./error-icon.svg);
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position-y: 4px;
    padding-left: 20px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    text-align: center;
}

/* Declined Active X view specific css */
.declined-view {
    width: 360px;
    padding: 25px !important;
    margin: auto;
}

.declined-view > .main-content-body > input {
    display: inline-block;
    margin: 10px;
}

/*Registration Method view specific css*/
#lbRestart_BROWSER_REGISTRATION_METHOD {
    display: block;
}
#lbRestart_BROWSER_REGISTRATION_METHOD:first-of-type {
    margin-top: 15px;
}

/* Carrier Update View specific css*/
#CarrierUpdateDiv {
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    max-width: 720px;
    margin: auto;
}

#HeaderLabel.alert-danger {
    background-image: url(./warning-carrier.png);
    background-position-y: center;
    background-repeat: no-repeat;
    background-size: 52px;
    padding-left: 60px;
    text-align: left;
}

#ApproveSpan,
#DeleteSpan,
#IgnoreSpan {
    background-image: url(./approve-carrier.png);
    background-position-y: center;
    background-repeat: no-repeat;
    padding-left: 25px;
    background-size: 18px;
    font-weight: 700;
    padding-top: 2px;
}

#DeleteSpan {
    background-image: url(./delete-carrier.png);
}

#IgnoreSpan {
    background-image: url(./ignore-carrier.png);
}

#ApproveP,
#IgnoreP,
#DeleteP {
    padding-left: 30px;
    margin-top: 5px;
}

#ApproveRadio,
#IgnoreRadio,
#DeleteRadio {
    margin: 0px 5px;
}

.carrierupdate__button {
    text-align: center;
    margin-top: 30px;
}

#CarrierUpdateDiv > div > div.main-content-body {
    border-bottom: none;
}

#lnkbtnAlternative {
    display: block;
}

/* SecureauthMd specific CSS */
#ContentPlaceHolder1_trrbKioskPublic,
#ContentPlaceHolder1_trrbKioskPrivate {
    height: 25px;
    position: relative;
}

#ContentPlaceHolder1_trrbKioskPublic > td > input,
#ContentPlaceHolder1_trrbKioskPrivate > td > input  {
    position: absolute;
    font-size: 14px;
}

#ContentPlaceHolder1_trrbKioskPublic > td > label,
#ContentPlaceHolder1_trrbKioskPrivate > td > label {
    cursor: pointer;
    font-weight: normal;
    line-height: 18px;
    min-height: 18px;
    padding-left: 17px;
}

#ContentPlaceHolder1_trrbKioskPublic > td,
#ContentPlaceHolder1_trrbKioskPrivate > td {
    color: #191c1d;
    display: block;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1;
    font-weight: bold;
}
/* SPINNER CSS */
.pre-loader {
    background: none repeat scroll 0 0 #fff;
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 10000;
}

.spinner {
    font-size: 70px;
    text-indent: -9999em;
    overflow: hidden;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    margin: -0.5em 0 0 -0.5em;
    position: fixed;
    left: 50%;
    top: 50%;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: spinner 1.7s infinite ease;
    animation: spinner 1.7s infinite ease;
}
@-webkit-keyframes spinner {
    0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
    }
  
    5%, 95% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
    }
  
    10%, 59% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, -0.087em -0.825em 0 -0.42em #575756, -0.173em -0.812em 0 -0.44em #575756, -0.256em -0.789em 0 -0.46em #575756, -0.297em -0.775em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, -0.087em -0.825em 0 -0.42em #575756, -0.173em -0.812em 0 -0.44em #575756, -0.256em -0.789em 0 -0.46em #575756, -0.297em -0.775em 0 -0.477em #575756;
    }
  
    20% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, -0.338em -0.758em 0 -0.42em #575756, -0.555em -0.617em 0 -0.44em #575756, -0.671em -0.488em 0 -0.46em #575756, -0.749em -0.34em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, -0.338em -0.758em 0 -0.42em #575756, -0.555em -0.617em 0 -0.44em #575756, -0.671em -0.488em 0 -0.46em #575756, -0.749em -0.34em 0 -0.477em #575756;
    }
  
    38% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, -0.377em -0.74em 0 -0.42em #575756, -0.645em -0.522em 0 -0.44em #575756, -0.775em -0.297em 0 -0.46em #575756, -0.82em -0.09em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, -0.377em -0.74em 0 -0.42em #575756, -0.645em -0.522em 0 -0.44em #575756, -0.775em -0.297em 0 -0.46em #575756, -0.82em -0.09em 0 -0.477em #575756;
    }
  
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
    }
}

@keyframes spinner {
    0% {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
    }
  
    5%, 95% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
    }
  
    10%, 59% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, -0.087em -0.825em 0 -0.42em #575756, -0.173em -0.812em 0 -0.44em #575756, -0.256em -0.789em 0 -0.46em #575756, -0.297em -0.775em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, -0.087em -0.825em 0 -0.42em #575756, -0.173em -0.812em 0 -0.44em #575756, -0.256em -0.789em 0 -0.46em #575756, -0.297em -0.775em 0 -0.477em #575756;
    }
  
    20% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, -0.338em -0.758em 0 -0.42em #575756, -0.555em -0.617em 0 -0.44em #575756, -0.671em -0.488em 0 -0.46em #575756, -0.749em -0.34em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, -0.338em -0.758em 0 -0.42em #575756, -0.555em -0.617em 0 -0.44em #575756, -0.671em -0.488em 0 -0.46em #575756, -0.749em -0.34em 0 -0.477em #575756;
    }
  
    38% {
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, -0.377em -0.74em 0 -0.42em #575756, -0.645em -0.522em 0 -0.44em #575756, -0.775em -0.297em 0 -0.46em #575756, -0.82em -0.09em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, -0.377em -0.74em 0 -0.42em #575756, -0.645em -0.522em 0 -0.44em #575756, -0.775em -0.297em 0 -0.46em #575756, -0.82em -0.09em 0 -0.477em #575756;
    }
  
    100% {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
      -webkit-box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
      box-shadow: 0 -0.83em 0 -0.4em #575756, 0 -0.83em 0 -0.42em #575756, 0 -0.83em 0 -0.44em #575756, 0 -0.83em 0 -0.46em #575756, 0 -0.83em 0 -0.477em #575756;
    }
  }


  /* end-user-base.css */
  .weight-normal {
    font-weight: normal !important;
}
.weight-normal > label {
    font-weight: normal !important;
}

.weight-bold {
    font-weight: normal !important;
}
.weight-bold > label {
    font-weight: normal !important;
}

.center {
    text-align: center;
}

.field-group:last-child,
.button-group:last-child {
    margin-bottom: 0px;
}

.field-group .radiobutton,
.field-group .checkbutton,
.button-group .radiobutton,
.button-group .checkbutton,
.registration-method-type .radiobutton,
.registration-method-type .checkbutton {
    padding-top: 0px;
}

.field-group label {
    color: #191C1D;
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
}

.field-group input:not([type=radio]),
.field-group input:not([type=checkbox]) {
    width: 100%;
    height: 40px;
    font-size: 16px;
    padding: 8px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #A6B5BA;
    box-shadow: none;
}

.field-group input:focus:not([type=radio]),
.field-group input:focus:not([type=checkbox]) {
    border: 1px solid #2A81D1;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
}

.field-group input[type=checkbox],
.field-group input[type=radio] {
    width: auto;
    height: auto;
    box-shadow: none;
}

.registration-method-type.not-supported {
    opacity: 0.35;
}

.registration-method-type.field-group input[type=radio] {
    top: 3px;
    left: -4px;
}

#placeHolder > .controlviewdiv-parent {
    text-align: center;
}

#placeHolder > .controlviewdiv-parent > .controlviewdiv,
.yubikeyprovisioningmargins.yubikeyprovisioningwidth {
    display: inline-block;
    max-width: 720px;
    text-align: center;
}

.yubikeyprovisioningmargins.yubikeyprovisioningwidth {
    display: block;
    margin: auto;
}

.yubikeyprovisioningmargins.yubikeyprovisioningwidth > div > div.main-content-body > ol {
    text-align: left;
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    padding-left: 18px;
}

.yubikeyprovisioningmargins.yubikeyprovisioningwidth > div > div.main-content-body > #ContentPlaceHolder1_Label2 {
    text-align: left;
    margin-left: 13%;
}

.yubiKeyInput {
    width: 75% !important;
}

.yubiKeyInputImage {
    height: 45px;
    width: 40px;
    background-image: url(./input-from-yubikey.png);
    background-repeat: no-repeat;
    position: absolute;
    background-size: 40px;
}

.main-content-container {
    margin-top: 50px;
    box-shadow: 0 16px 24px 0 rgba(0,0,0,0.1);
    background-color: rgba(255,255,255,0.9);
    padding-top: 32px;
    padding-left: 106px;
    padding-bottom: 64px;
    padding-right: 106px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.main-content-container.mfa-view {
    padding-left: 38px;
    padding-right: 38px;
    width: 100%;
    max-width: 702px;
}
.main-content-container.mfa-view > .main-content-header {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}
.main-content-container.mfa-view > .main-content-body {
    padding-left: 0px;
    padding-right: 0px;
}
.main-content-container.mfa-view > .main-content-separator {
    margin-left: 105px;
    margin-right: 105px;
}

.main-content-header {
    margin-bottom: 10px;
    text-align: center;
}

.main-content-header span{
    max-width: 510px;
    min-width: auto;
    color: #191c1d;
    font-size: 24px;
    padding-top: 18px;
    padding-bottom: 18px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
}

.main-content-header .input-from-mobile-approve {
    padding-left: 78px;
    background-image: url(./input-from-mobile-approve.png);
    background-position-y: center;
    background-position-x: 18px;
    background-repeat: no-repeat;
}

.main-content-header .input-from-mobile-approve {
    padding-left: 56px;
    background-position-x: 0px;
    min-width: auto;
}

.main-content-header .input-from-mobile-symbol {
    padding-left: 56px;
    background-image: url(./input-from-mobile-symbol.png);
    background-position-y: center;
    background-position-x: 0px;
    background-size: 40px 62px;
    background-repeat: no-repeat;
    min-width: auto;
}

.main-content-header .input-from-help,
.main-content-header .input-from-pin,
.main-content-header .input-from-hotp,
.main-content-header .input-from-desktop,
div.additionalMethods {
        padding-left: 78px;
        background-image: url(./input-from-pin.png);
        background-position-y: center;
        background-repeat: no-repeat;
    }

.main-content-header .input-from-email, div.emailMethods {
    padding-left: 78px;
    background-image: url(./input-from-email.png);
    background-size: 64px 58px;
    background-position-x: 4px;
    background-position-y: center;
    background-repeat: no-repeat;
}

.main-content-header .input-from-phone, div.voiceMethods {
    padding-left: 78px;
    background-image: url(./input-from-phone.png);
    background-position-y: center;
    background-repeat: no-repeat;
}

.main-content-header .input-from-sms, div.smsMethods {
    padding-left: 78px;
    background-image: url(./input-from-sms.png);
    background-position-x: 4px;
    background-position-y: center;
    background-repeat: no-repeat;
}

.main-content-header .input-from-mobile,
div.authenticateMethods,
.main-content-header .input-from-oath {
    padding-left: 78px;
    background-image: url(./input-from-mobile.png);
    background-position-x: 18px;
    background-position-y: center;
    background-repeat: no-repeat;
}

.main-content-header .input-from-yubikey,
div.hardwareMethods {
    padding-left: 78px;
    background-image: url(./input-from-yubikey.png);
    background-position-y: center;
    background-repeat: no-repeat;
}

.main-content-header .input-from-fido2,
div.fido2Methods {
    padding-left: 78px;
    background-image: url(./input-from-fido.png);
    background-position-y: center;
    background-repeat: no-repeat;
}

.main-content-separator {
    height: 5px;
    border-top: 2px solid #dfe7ea;
    margin-left: 0px;
    margin-right: 0px;
}

.main-content-container.mfa-view > .main-content-body {
    border-top: 0px;
    border-bottom: 0px;
}

.main-content-body {
    border-top: 2px solid #dfe7ea;
    border-bottom: 2px solid #dfe7ea;
    padding-top: 32px;
    padding-right: 33px;
    padding-bottom: 32px;
    padding-left: 33px;
}

.main-content-body > div,
.main-content-body > span {
    max-width: 490px;
}

.main-content-container.mfa-view > .main-content-body > div {
    max-width: none;
}

.main-content-body .field-group {
    margin-bottom: 16px;
}

.main-content-body .field-label {
    display: block;
    color: #191C1D;
    font-size: 16px;
    font-weight: bold;
    line-height: 24px;
}

.main-content-body input.field-error {
    background-color: #fae7e7;
    border-color: #fae7e7;
    outline: none;
}

.field-input:not([type="radio"]),
.field-input:not([type="checkbox"]) {
    height: 40px;
    width: 315px;
    font-size: 16px;
    padding: 8px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border: 1px solid #A6B5BA;
    box-shadow: none;
}

.field-input.field-error:not([type="radio"]),
.field-input.field-error:not([type="checkbox"]) {
    background-color: #fae7e7;
    border: 1px solid #d20f0f;
    outline: none;
}

.field-input.field-error:focus:not([type="radio"]),
.field-input.field-error:focus:not([type="checkbox"]) {
    background-color: #fae7e7;
    border: 1px solid #fae7e7;
    box-shadow: 0 0 4px 0 #d20f0f;
    outline: none;
}

.field-input:focus:not([type="radio"]),
.field-input:focus:not([type="checkbox"]) {
    border: 1px solid #2A81D1;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
}

.main-content-body .field-button {
    height: 40px;
    width: 101px;
    margin-left: 4px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.1);
}

.main-content-body .field-button:disabled {
    background-color: #cfd7da;
    border-color: #cfd7da;
    color: #727e83;
}

.main-content-body .symbol {
    text-align: center;
    margin-bottom: 56px;
    position: relative;

}

.main-content-body .symbol>div {
    display: inline-block;
    position: relative;
}

.main-content-body .symbol span {
    display: inline-block;
    color: #191C1D;
    font-size: 48px;
    line-height: 64px;
    text-align: center;
    padding-top: 36px;
    padding-left: 47px;
    padding-right: 47px;
    padding-bottom: 41px;
    border: 2px solid #727E83;
}

.main-content-body .symbol div.mobile-symbol-icon {
    position: absolute;
    background-image: url(./input-from-mobile-symbol.png);
    width: 46px;
    height: 80px;
    bottom: -26px;
    right: -20px;
}

.main-content-footer {
    text-align: center;
    padding-top: 32px;
}

span.field-error {
    margin-top: 4px;
    display: block;
    color: #D20F0F;
    font-size: 16px;
    line-height: 24px;
    background-image: url(./error-icon.svg);
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-position-y: 4px;
    padding-left: 20px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

span.field-info {
    background-position: 8px 50%;
    background-repeat: no-repeat;
    background-size: 26px;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    color: #191c1d;
    display: table;
    padding: 8px 8px 8px 40px;
    background-color: #e9f2fa;
    border-color: #2a81d1;
    background-image: url(./info-icon.png);
}

span.field-system-error {
    display: block;
    color: #D20F0F;
    font-size: 16px;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.main-content-body.field-system-error::before {
    transform: rotate(45deg);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' fill='%23d20f0f'%3E%3Cdefs%3E%3Cpath d='M13 11h4a1 1 0 0 1 0 2h-4v4a1 1 0 0 1-2 0v-4H7a1 1 0 0 1 0-2h4V7a1 1 0 0 1 2 0v4zm9 1c0 5.522-4.478 10-10 10S2 17.522 2 12C2 6.477 6.477 2 12 2s10 4.477 10 10zm-2 0a8 8 0 0 0-8-8 8 8 0 1 0 8 8z' id='a'/%3E%3C/defs%3E%3Cmask id='b' fill='%23fff'%3E%3Cuse xlink:href='%23a'/%3E%3C/mask%3E%3Cg mask='url(%23b)'%3E%3Cpath d='M0 0h28v28H0z'/%3E%3C/g%3E%3C/svg%3E");
    background-size: 20px;
    background-repeat: no-repeat;
    background-position-y: 5px;
    width: 40px;
    height: 30px;
    display: block;
    content: "";
    position: absolute;
}

#ContentPlaceHolder1_MFALoginControl1_SystemErrorView_lblErrMessage, #fido_lblErrMessage {
    color: #D20F0F;
    padding-left: 40px;
}
#fido_lblErrMessage div#fido_lblErrMessage_links {
    color: #D20F0F;
    text-align: center;
    padding-right: 40px;
}
#fido_lblErrMessage div#fido_lblErrMessage_links a {
    color: #D20F0F;
    text-decoration: underline;
}



.button-group {
    max-width: 490px;
    margin-bottom: 16px;
}

.button-group.waiting {
    margin-top: 16px;
    text-align: center
}

.field-input.checkbox label {
    margin-left: 2px;
}

div.waiting-spinner {
    background-image: url(./waiting.gif);
    background-size: 188px 8px;
    background-position-x: center;
    background-repeat: no-repeat;
    max-width: 510px;
    height: 8px;
}

.main-content-body > div.waiting-spinner {
    margin-top: 32px;
    margin-bottom: 48px;
}

div.waiting-message {
    text-align: center;
}


div.field-group.registration-method-type {
    box-sizing: border-box;
    min-height: 78px;
    padding-left: 78px;
    background-position-y: 8px;
    margin-bottom: 36px;
    display: table;
    height: 80px;
}

div.field-group.registration-method-type.emailMethods {
    min-height: 66px;
}

div.field-group.registration-method-type.smsMethods {
    min-height: 60px;
}

div.field-group.registration-method-type.voiceMethods {
    min-height: 72px;
}

div.registration-method-type table {
    width: 100%;
    display: table-cell;
    vertical-align: middle;
}

div.registration-method-type table td:first {
    padding-top: none;
}

div.field-group.registration-method-type label {
    font-weight: normal;
}

.privacy-controls {
    padding-bottom: 16px;
}

.privacy-controls span.rbKiosk {
    display: block;
    text-align: left;
}

#kioskblock span.rbKiosk,
.privacy-controls span.rbKiosk {
    padding-bottom: 0px;
    margin: 0px;
}

#kioskblock span.rbKiosk:last-of-type,
.privacy-controls span.rbKiosk:last-child {
    padding-top: 4px;
    padding-bottom: 4px;
    margin-bottom: 5px;
}


.privacy-controls span.lblKiosk {
    font-weight: bold;
}

.main-content-footer div.button-group {
    max-width: 100%;
}

.realmTitle {
    margin-top: 16px;
    border-top: 2px solid #dfe7ea;
}

div.realmTitle span#lblTop {
    padding-bottom: 6px;
    font-size: 18px;
}

#oidcEndSessionContainer {
    padding-bottom: 32px;
    padding-left: 75px;
    padding-right: 75px;
}

#ContentPlaceHolder1_pnlConfirmation, #ContentPlaceHolder1_pnlClose {
    font-family: "Open Sans", Helvetica, Arial, sans-serif;
    font-size: 16px;
}

@media (max-width: 767px) {
    .main-content-container {
        margin-top: 50px;
        box-shadow: 0 16px 24px 0 rgba(0,0,0,0.1);
        background-color: rgba(255,255,255,0.9);
        padding-top: 32px;
        padding-left: 20px;
        padding-bottom: 32px;
        padding-right: 20px;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        margin-left: -2px;
    }

    body {
        width: 100% !important;
        background: none;
    }

    .main-content-header span{
        min-width: 100px;
    }
    
    .main-content-body {
        padding-top: 32px;
        padding-right: 0px;
        padding-bottom: 32px;
        padding-left: 0px;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border-bottom: 2px solid #dfe7ea;
    }

    .main-content-body .field-input:not([type="radio"]) {
        width: 100%;
    }

    .main-content-body .field-button {
        width: 100%;
        margin-top: 16px;
        margin-left: 0px;
    }

    .button-group input[type="submit"] {
        width: 100% !important;
    }

    #ContentPlaceHolder1_table1 {
        width: 100% !important;
    }

    .main-content-container.mfa-view {
        max-width: 100%;
    }
    div.field-group.registration-method-type {
        padding-left: 0px;
        background-image: none;
        height: auto;
        min-height: auto;
        margin-bottom: 24px;
    }
    div.field-group.registration-method-type.voiceMethods {
        min-height: auto;
    }
    div.field-group.registration-method-type.additionalMethods {
        margin-bottom: 0px;
    }

    #qrblock {
        display: none;
    }
}

#qrblock {
    position: relative;   
}

.qr-progress-img {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%);
}