article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
            display: block
        }

        audio, canvas, video {
            display: inline-block
        }

            audio:not([controls]) {
                display: none;
                height: 0
            }

        [hidden] {
            display: none
        }

        html {
            font-family: 'Source Sans Pro', sans-serif;
            font-weight: normal;
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
            -webkit-font-smoothing: antialiased !important
        }

        body {
            background-color: #fff;
            background-image: url("/ig-adapter-security-code-challenge/login-bg.png");
            color: #404040;
            margin: 0;
            font-size: 16px;
            line-height: 1.375
        }

        @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3 / 2), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
            body {
                background-image: url("/ig-adapter-security-code-challenge/login-bg-2x.png");
                background-size: 3px 3px
            }
        }

        a {
            color: #4D90FE;
            text-decoration: none;
            -webkit-tap-highlight-color: transparent
        }

            a:focus {
                outline: 0
            }

            a:hover, a:active {
                color: #0161fd;
                outline: 0
            }

        abbr[title] {
            border-bottom: 1px dotted
        }

        b, strong {
            font-weight: bold
        }

        dfn, em {
            font-style: italic
        }

        hr {
            -moz-box-sizing: content-box;
            box-sizing: content-box;
            height: 0
        }

        mark {
            background: #ff0;
            color: #000
        }

        code, kbd, pre, samp {
            font-family: monospace, serif;
            font-size: 1em
        }

        pre {
            white-space: pre-wrap
        }

        q {
            quotes: "\201C" "\201D" "\2018" "\2019"
        }

        small {
            font-size: 80%
        }

        sub, sup {
            font-size: 75%;
            line-height: 0;
            position: relative;
            vertical-align: baseline
        }

        sup {
            top: -0.5em
        }

        sub {
            bottom: -0.25em
        }

        img {
            border: 0;
            max-width: 100%;
            height: auto;
            vertical-align: middle;
            -ms-interpolation-mode: bicubic
        }

        svg:not(:root) {
            overflow: hidden
        }

        figure {
            margin: 0
        }

        fieldset {
            border: 0;
            margin: 0 2px;
            padding: 0.35em 0.625em 0.75em
        }

        legend {
            border: 0;
            padding: 0
        }

        button, input, select, textarea {
            font-family: inherit;
            font-size: 100%;
            margin: 0
        }

        button, input {
            line-height: normal
        }

        button, select {
            text-transform: none
        }

        button, html input[type="button"], input[type="reset"], input[type="submit"] {
            -webkit-appearance: button;
            cursor: pointer
        }

            button[disabled], html input[disabled] {
                cursor: default
            }

        input[type="checkbox"], input[type="radio"] {
            box-sizing: border-box;
            padding: 0
        }

        input[type="search"] {
            -webkit-appearance: textfield;
            -moz-box-sizing: content-box;
            -webkit-box-sizing: content-box;
            box-sizing: content-box
        }

            input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
                -webkit-appearance: none
            }

        button::-moz-focus-inner, input::-moz-focus-inner {
            border: 0;
            padding: 0
        }

        textarea {
            overflow: auto;
            vertical-align: top
        }

        table {
            border-collapse: collapse;
            border-spacing: 0
        }

        *, *:before, *:after {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box
        }

        h1, h2, h3, h4, h5, h6, p, blockquote, pre, dl, dd, ol, ul, form, fieldset, legend, table, th, td, caption, hr {
            margin: 0;
            padding: 0
        }

        abbr[title], dfn[title] {
            cursor: help
        }

        u, ins {
            text-decoration: none
        }

        form {
            text-align: left\9;
        }

        ;ins {
            border-bottom: 1px solid
        }

        img {
            font-style: italic
        }

        label, input, textarea, button, select, option {
            cursor: pointer
        }

            .text-input:active, .text-input:focus, textarea:active, textarea:focus {
                cursor: text;
                outline: none
            }
		/* Force readonly look for PingFed username field */
input.form-control.readonly-field[readonly] {
    background-color: #e6f0ff !important; /* light blue */
    color: #333 !important;
    border: 1px solid #ccc !important;
    cursor: not-allowed;
}


        .btn {
            border-radius: 3px;
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box;
            border: 0;
            display: inline-block;
            padding: 9px 30px;
            font-size: 16px;
            line-height: 1.375;
            font-weight: normal;
            text-align: center;
            vertical-align: middle;
            cursor: pointer;
            text-decoration: none !important;
            background: #4D90FE;
            color: white;
            height: 44px;
            -webkit-transition: 0.2s;
            -moz-transition: 0.2s;
            -o-transition: 0.2s;
            transition: 0.2s
        }

            .btn:hover, .btn:focus {
                background: #3480fe;
                color: white
            }

            .btn.active, .btn:active {
                background: #3480fe
            }

            .btn.btn-block {
                display: block;
                width: 100%;
                padding-left: 0;
                padding-right: 0;
                margin-bottom: 15px
            }

            .btn + .btn {
                margin-left: 10px;
                background: #ccc;
                color: #333
            }

                .btn + .btn:hover, .btn + .btn:active, .btn + .btn:focus {
                    background: #bfbfbf
                }

        @media screen and (max-width: 767px) {
            .btn + .btn {
                margin: 15px 0;
                font-size: 16px
            }
        }

        @media screen and (max-width: 767px) {
            .btn {
                display: block;
                padding-right: 0;
                padding-left: 0
            }
        }

        label {
            display: block;
            max-width: 100%;
            margin-bottom: 5px
        }

        input, textarea, button, select {
            font-family: inherit;
            font-size: 16px
        }

            input :-moz-placeholder, textarea :-moz-placeholder {
                color: #999
            }

            input:-ms-input-placeholder, textarea:-ms-input-placeholder {
                color: #999
            }

            input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
                color: #999
            }

        .form-control {
            width: 100%;
            height: 44px;
            height: 30px\9;
            padding: 5px;
            color: #555;
            background-color: white;
            border: 1px solid #979797;
            box-shadow: none;
            box-sizing: border-box;
            border-radius: 3px
        }

            .form-control:focus {
                outline: 0;
                background-color: #fff;
                border-color: #4D90FE
            }

        .form-group {
            margin-bottom: 4px
        }
		

        .error {
            color: #dc322f
        }

        .error-block, .ico-success {
            display: none
        }

        .has-error {
            color: #dc322f
        }

            .has-error .form-control {
                color: #dc322f;
                border-color: #dc322f
            }

            .has-error .error-block {
                display: block
            }

        html, body {
            height: 100%;
            min-height: 640px
        }

        .push {
            height: 150px
        }

        .main {
            background: none !important;
			padding-bottom: 150px;
            padding-top: 20px\9;
        }
		
.auth-links {
    text-align: center;   /* centers all inline content (like <a>) */
    margin-top: 40px;
	visibility: visible;
}

.auth-links a {
    display: inline-block;   /* makes spacing more consistent */
    bottom: 5px;           /* vertical gap between links */
    color: #4D90FE;          /* link color */
    text-decoration: none;   /* remove underline */
    font-size: 16px;
	visibility: visible;
	position:relative;
}

.auth-links a:hover {
    text-decoration: none; /* underline only on hover */
}

        .footer {
            background: white;
            padding: 5% 5% 3%;
            color: #666;
            font-size: 12px;
            min-height: 150px;
            text-align: justify
        }

            .footer p {
                margin-bottom: 10px
            }

                .footer p:last-child {
                    margin-bottom: 0
                }
.footer .copyright {
    text-align: center !important;
    display: block;     /* no need for flex */
}
        .header {
            background: #404040 url("/ig-adapter-security-code-challenge/logo.png") no-repeat 50%;
           /* background-size: 15% 80%;*/
			height: 80px;
            background-image: url("/ig-adapter-security-code-challenge/logo.png")
        }

        @media (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3 / 2), (min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx)
        }

        .header h1 {
            display: none
        }

        body {
            min-height: 100%;
            position: relative
        }

            body .login-wrapper {
                width: 300px;
                margin: 0 auto;
                padding-top: 8%
            }

                body .login-wrapper p {
                    margin-bottom: 10px;
                    text-align: center
                }

                body .login-wrapper.content {
                    width: 600px;
                    padding-top: 4%
                }

                    body .login-wrapper.content p {
                        text-align: left
                    }

        @media screen and (max-width: 767px) {
            body .login-wrapper.content {
                width: 300px
            }
        }

        body .login-wrapper.content .center, body .login-wrapper.content p.center {
            text-align: center
        }

        @media screen and (max-width: 767px) {
            body .login-wrapper.content p, body .login-wrapper.content li {
                font-size: 14px
            }
        }

        .hidden {
            display: none
        }

        .callout {
            border: 1px solid #ccc;
            padding: 10px;
            border-radius: 10px;
            margin-bottom: 20px
        }

            .callout h2, .callout p {
                text-align: center !important;
                margin-bottom: 10px
            }

        @media screen and (max-width: 767px) {
            .callout h2 {
                font-size: 19px
            }
        }

        ul {
            margin-left: 30px
        }

            ul li {
                margin-bottom: 10px
            }

        h3 {
            margin-bottom: 10px
        }

        hr {
            background: transparent;
            height: 0;
            border: 0;
            border-top: 1px solid #999;
            margin: 20px auto;
            width: 80px
        }

        .note {
            color: #999
        }

        @media only screen and (max-device-width: 962px) {
            .securityKey {
                display: none
            }
        }

	/* New Code for the HREF Link*/
		.marriott-secure-container {
    width: 100%;
    margin: 28px 0 0 0;
    padding: 0;
}

.marriott-secure-box {
    display: flex;
    align-items: center;
    justify-content: flex-start;

    width: 305px !important;
    max-width: 305px !important;
    height: 50px;

    margin: 0 auto !important;
    padding: 10px 18px !important;

    box-sizing: border-box !important;

    gap: 14px;

    border: 2px solid #009E00;
    border-radius: 8px;

    background: #ffffff;
}

.marriott-secure-icon {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    max-width: 46px !important;

    object-fit: contain;
    flex-shrink: 0;
}

.marriott-secure-link {
    display: block;

    margin: 0;
    padding: 0;

    color: #009E00 !important;

    font-size: 14px;
    font-weight: 600;
    line-height: 20px;

    text-align: left;
    text-decoration: underline !important;
}

.marriott-secure-link:hover,
.marriott-secure-link:focus,
.marriott-secure-link:visited {
    color: #009E00 !important;
}

.marriott-secure-line {
    display: block;
    white-space: nowrap;
    margin: 0;
    padding: 0;
}