/* This CSS is generated by PhenixID Framework version 1.0 in February 2019. */ /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* This CSS is generated by PhenixID Framework version 2.8 in September 2018. */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* sass sheet variables */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* sass sheet variables */ @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Regular.ttf"); font-style: normal; font-weight: normal; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Bold.ttf"); font-style: normal; font-weight: 700; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Italic.ttf"); font-style: italic; font-weight: normal; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-BoldItalic.ttf"); font-style: italic; font-weight: 700; } .modal-content .modal-header { display: flex; border-bottom: 1px solid transparent; } .modal-content .modal-header * { display: flex; color: #285a8a; } .modal-content .modal-header h5.modal-title { flex: auto; font-size: 24px; } .modal-content .modal-body { color: #606060; } .modal-content .modal-footer { border-top: 1px solid #97a8c3; background: #FFF; padding: 0px; margin: 0px; } .modal-content .modal-footer * { display: flex; height: 100%; background: #f8f9fa; text-align: center; justify-content: center; color: #285a8a; padding: 12px; width: 100%; opacity: 0.8; } .modal-content .modal-footer *:hover, .modal-content .modal-footer *:focus, .modal-content .modal-footer *:active { opacity: 1; background: #FFF; } /* HTML Base defaults :: HTML5 display-role reset for older browsers */ * { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } h1, h2, h3, h4, h5, h6 { font-family: "Open Sans", "Poppins", sans-serif; } body { line-height: 1; font-family: "Open Sans", "Poppins", sans-serif; font-size: 16px; } ol, ul { list-style: none; } .hidden { display: none; } .show { display: block; } /* This CSS is generated by PhenixID Framework version 1.0 in Febuary 2019. */ .d-none { display: none !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-block { display: block !important; } .d-table { display: table !important; } .d-table-row { display: table-row !important; } .d-table-cell { display: table-cell !important; } .d-flex { display: flex !important; } .d-inline-flex { display: inline-flex !important; } @media (min-width: 576px) { .d-sm-none { display: none !important; } .d-sm-inline { display: inline !important; } .d-sm-inline-block { display: inline-block !important; } .d-sm-block { display: block !important; } .d-sm-table { display: table !important; } .d-sm-table-row { display: table-row !important; } .d-sm-table-cell { display: table-cell !important; } .d-sm-flex { display: flex !important; } .d-sm-inline-flex { display: inline-flex !important; } } @media (min-width: 768px) { .d-md-none { display: none !important; } .d-md-inline { display: inline !important; } .d-md-inline-block { display: inline-block !important; } .d-md-block { display: block !important; } .d-md-table { display: table !important; } .d-md-table-row { display: table-row !important; } .d-md-table-cell { display: table-cell !important; } .d-md-flex { display: flex !important; } .d-md-inline-flex { display: inline-flex !important; } } @media (min-width: 992px) { .d-lg-none { display: none !important; } .d-lg-inline { display: inline !important; } .d-lg-inline-block { display: inline-block !important; } .d-lg-block { display: block !important; } .d-lg-table { display: table !important; } .d-lg-table-row { display: table-row !important; } .d-lg-table-cell { display: table-cell !important; } .d-lg-flex { display: flex !important; } .d-lg-inline-flex { display: inline-flex !important; } } @media (min-width: 1200px) { .d-xl-none { display: none !important; } .d-xl-inline { display: inline !important; } .d-xl-inline-block { display: inline-block !important; } .d-xl-block { display: block !important; } .d-xl-table { display: table !important; } .d-xl-table-row { display: table-row !important; } .d-xl-table-cell { display: table-cell !important; } .d-xl-flex { display: flex !important; } .d-xl-inline-flex { display: inline-flex !important; } } @media print { .d-print-none { display: none !important; } .d-print-inline { display: inline !important; } .d-print-inline-block { display: inline-block !important; } .d-print-block { display: block !important; } .d-print-table { display: table !important; } .d-print-table-row { display: table-row !important; } .d-print-table-cell { display: table-cell !important; } .d-print-flex { display: flex !important; } .d-print-inline-flex { display: inline-flex !important; } } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ /* This CSS is generated by PhenixID Framework version 2.8 in September 2018. */ /* The file imports */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* sass sheet variables */ /* This CSS is generated by PhenixID Framework version 2.8 in September 2018. */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* sass sheet variables */ @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Regular.ttf"); font-style: normal; font-weight: normal; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Bold.ttf"); font-style: normal; font-weight: 700; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Italic.ttf"); font-style: italic; font-weight: normal; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-BoldItalic.ttf"); font-style: italic; font-weight: 700; } /* The default classes are bellow */ /* The default classes are bellow */ /* The default classes are bellow */ .btn, *.btn, button.btn, *.button, *.btn-primary, *.btn-reject, .button, .btn-primary, .btn-reject, button.button, button.btn-primary, button.btn-reject { display: inherit; font-family: inherit; font-weight: 700; font-size: 14px; line-height: 19.84px; letter-spacing: 2.8px; text-transform: none!important; border: none; cursor: pointer; text-decoration: none; border-radius: 4px; -webkit-border-radius: 4px; -moz-border-radius: 4px; } .btn.btn-primary:focus, *.btn.btn-primary:focus, button.btn.btn-primary:focus, *.button.btn-primary:focus, *.btn-primary:focus, .button.btn-primary:focus, .btn-primary:focus, button.button.btn-primary:focus, button.btn-primary:focus { background-color: #1d4062; } .btn.hidden, *.btn.hidden, button.btn.hidden, *.button.hidden, *.hidden.btn-primary, *.hidden.btn-reject, .button.hidden, .hidden.btn-primary, .hidden.btn-reject, button.button.hidden, button.hidden.btn-primary, button.hidden.btn-reject { display: none !important; } .btn.square, *.btn.square, button.btn.square, *.button.square, *.square.btn-primary, *.square.btn-reject, .button.square, .square.btn-primary, .square.btn-reject, button.button.square, button.square.btn-primary, button.square.btn-reject { border-radius: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; } .btn.oval, *.btn.oval, button.btn.oval, *.button.oval, *.oval.btn-primary, *.oval.btn-reject, .button.oval, .oval.btn-primary, .oval.btn-reject, button.button.oval, button.oval.btn-primary, button.oval.btn-reject { border-radius: 31px; -webkit-border-radius: 31px; -moz-border-radius: 31px; } .btn:hover, *.btn:hover, button.btn:hover, *.button:hover, *.btn-primary:hover, *.btn-reject:hover, .button:hover, .btn-primary:hover, .btn-reject:hover, button.button:hover, button.btn-primary:hover, button.btn-reject:hover { text-decoration: none; } .btn.button-huge, *.btn.button-huge, button.btn.button-huge, *.button.button-huge, *.button-huge.btn-primary, *.button-huge.btn-reject, .button.button-huge, .button-huge.btn-primary, .button-huge.btn-reject, button.button.button-huge, button.button-huge.btn-primary, button.button-huge.btn-reject { margin: 25px auto; font-weight: 600; border-radius: 16px; -webkit-border-radius: 16px; -moz-border-radius: 16px; line-height: 40px; letter-spacing: 0.33px; height: 40px; min-width: 150px; padding: 0 25px; display: flex; justify-content: center; } @media only screen and (max-width: 600px) { .btn.button-huge, *.btn.button-huge, button.btn.button-huge, *.button.button-huge, *.button-huge.btn-primary, *.button-huge.btn-reject, .button.button-huge, .button-huge.btn-primary, .button-huge.btn-reject, button.button.button-huge, button.button-huge.btn-primary, button.button-huge.btn-reject { min-width: 100px; } } .btn.squarebutton, *.btn.squarebutton, button.btn.squarebutton, *.button.squarebutton, *.squarebutton.btn-primary, *.squarebutton.btn-reject, .button.squarebutton, .squarebutton.btn-primary, .squarebutton.btn-reject, button.button.squarebutton, button.squarebutton.btn-primary, button.squarebutton.btn-reject { display: block; width: 100%; height: 60px; margin: 25px 0; font-size: 13px; font-weight: 600; line-height: 45px; letter-spacing: 0.33px; } .btn.normal, *.btn.normal, button.btn.normal, *.button.normal, *.normal.btn-primary, *.normal.btn-reject, .button.normal, .normal.btn-primary, .normal.btn-reject, button.button.normal, button.normal.btn-primary, button.normal.btn-reject { text-transform: none; } .btn .squarebutton[disabled], *.btn .squarebutton[disabled], button.btn .squarebutton[disabled], *.button .squarebutton[disabled], *.btn-primary .squarebutton[disabled], *.btn-reject .squarebutton[disabled], .button .squarebutton[disabled], .btn-primary .squarebutton[disabled], .btn-reject .squarebutton[disabled], button.button .squarebutton[disabled], button.btn-primary .squarebutton[disabled], button.btn-reject .squarebutton[disabled] { cursor: default; } .btn .cancel-button, *.btn .cancel-button, button.btn .cancel-button, *.button .cancel-button, *.btn-primary .cancel-button, *.btn-reject .cancel-button, .button .cancel-button, .btn-primary .cancel-button, .btn-reject .cancel-button, button.button .cancel-button, button.btn-primary .cancel-button, button.btn-reject .cancel-button { height: 40px; width: 40px; margin-right: 25px; display: inline-block; cursor: pointer; } .btn .select-buttons, *.btn .select-buttons, button.btn .select-buttons, *.button .select-buttons, *.btn-primary .select-buttons, *.btn-reject .select-buttons, .button .select-buttons, .btn-primary .select-buttons, .btn-reject .select-buttons, button.button .select-buttons, button.btn-primary .select-buttons, button.btn-reject .select-buttons { width: 100%; } .btn .select-button, *.btn .select-button, button.btn .select-button, *.button .select-button, *.btn-primary .select-button, *.btn-reject .select-button, .button .select-button, .btn-primary .select-button, .btn-reject .select-button, button.button .select-button, button.btn-primary .select-button, button.btn-reject .select-button { display: block; border: 1px solid #ededed; font-family: "Open Sans"; font-size: 13px; font-weight: 600; line-height: 45px; letter-spacing: 0.33px; color: #444444; text-decoration: none; font-weight: 400; margin: 20px 0; display: flex; align-items: center; justify-content: space-between; line-height: normal; padding: 5px 10px 5px 5px; } .btn a[disabled], .btn a[disabled]:hover, .btn button[disabled], .btn input[disabled], .btn button[disabled]:hover, .btn button[disabled]:active, .btn button[disabled]:focus, *.btn a[disabled], *.btn a[disabled]:hover, *.btn button[disabled], *.btn input[disabled], *.btn button[disabled]:hover, *.btn button[disabled]:active, *.btn button[disabled]:focus, button.btn a[disabled], button.btn a[disabled]:hover, button.btn button[disabled], button.btn input[disabled], button.btn button[disabled]:hover, button.btn button[disabled]:active, button.btn button[disabled]:focus, *.button a[disabled], *.btn-primary a[disabled], *.btn-reject a[disabled], *.button a[disabled]:hover, *.btn-primary a[disabled]:hover, *.btn-reject a[disabled]:hover, *.button button[disabled], *.btn-primary button[disabled], *.btn-reject button[disabled], *.button input[disabled], *.btn-primary input[disabled], *.btn-reject input[disabled], *.button button[disabled]:hover, *.btn-primary button[disabled]:hover, *.btn-reject button[disabled]:hover, *.button button[disabled]:active, *.btn-primary button[disabled]:active, *.btn-reject button[disabled]:active, *.button button[disabled]:focus, *.btn-primary button[disabled]:focus, *.btn-reject button[disabled]:focus, .button a[disabled], .btn-primary a[disabled], .btn-reject a[disabled], .button a[disabled]:hover, .btn-primary a[disabled]:hover, .btn-reject a[disabled]:hover, .button button[disabled], .btn-primary button[disabled], .btn-reject button[disabled], .button input[disabled], .btn-primary input[disabled], .btn-reject input[disabled], .button button[disabled]:hover, .btn-primary button[disabled]:hover, .btn-reject button[disabled]:hover, .button button[disabled]:active, .btn-primary button[disabled]:active, .btn-reject button[disabled]:active, .button button[disabled]:focus, .btn-primary button[disabled]:focus, .btn-reject button[disabled]:focus, button.button a[disabled], button.btn-primary a[disabled], button.btn-reject a[disabled], button.button a[disabled]:hover, button.btn-primary a[disabled]:hover, button.btn-reject a[disabled]:hover, button.button button[disabled], button.btn-primary button[disabled], button.btn-reject button[disabled], button.button input[disabled], button.btn-primary input[disabled], button.btn-reject input[disabled], button.button button[disabled]:hover, button.btn-primary button[disabled]:hover, button.btn-reject button[disabled]:hover, button.button button[disabled]:active, button.btn-primary button[disabled]:active, button.btn-reject button[disabled]:active, button.button button[disabled]:focus, button.btn-primary button[disabled]:focus, button.btn-reject button[disabled]:focus { background: #ededed; color: #bdbdbd; cursor: auto; } .btn .select-button:hover, .btn .select-button:focus, .btn .select-button:active, *.btn .select-button:hover, *.btn .select-button:focus, *.btn .select-button:active, button.btn .select-button:hover, button.btn .select-button:focus, button.btn .select-button:active, *.button .select-button:hover, *.btn-primary .select-button:hover, *.btn-reject .select-button:hover, *.button .select-button:focus, *.btn-primary .select-button:focus, *.btn-reject .select-button:focus, *.button .select-button:active, *.btn-primary .select-button:active, *.btn-reject .select-button:active, .button .select-button:hover, .btn-primary .select-button:hover, .btn-reject .select-button:hover, .button .select-button:focus, .btn-primary .select-button:focus, .btn-reject .select-button:focus, .button .select-button:active, .btn-primary .select-button:active, .btn-reject .select-button:active, button.button .select-button:hover, button.btn-primary .select-button:hover, button.btn-reject .select-button:hover, button.button .select-button:focus, button.btn-primary .select-button:focus, button.btn-reject .select-button:focus, button.button .select-button:active, button.btn-primary .select-button:active, button.btn-reject .select-button:active { text-decoration: none; } .btn .select-button .methodimage, .btn .select-button .placeholder, *.btn .select-button .methodimage, *.btn .select-button .placeholder, button.btn .select-button .methodimage, button.btn .select-button .placeholder, *.button .select-button .methodimage, *.btn-primary .select-button .methodimage, *.btn-reject .select-button .methodimage, *.button .select-button .placeholder, *.btn-primary .select-button .placeholder, *.btn-reject .select-button .placeholder, .button .select-button .methodimage, .btn-primary .select-button .methodimage, .btn-reject .select-button .methodimage, .button .select-button .placeholder, .btn-primary .select-button .placeholder, .btn-reject .select-button .placeholder, button.button .select-button .methodimage, button.btn-primary .select-button .methodimage, button.btn-reject .select-button .methodimage, button.button .select-button .placeholder, button.btn-primary .select-button .placeholder, button.btn-reject .select-button .placeholder { width: 60px; height: 60px; display: inline-block; margin-right: 20px; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; flex-shrink: 0; } .btn .select-button .label, *.btn .select-button .label, button.btn .select-button .label, *.button .select-button .label, *.btn-primary .select-button .label, *.btn-reject .select-button .label, .button .select-button .label, .btn-primary .select-button .label, .btn-reject .select-button .label, button.button .select-button .label, button.btn-primary .select-button .label, button.btn-reject .select-button .label { display: flex; align-items: center; } .btn .select-button .arrow, *.btn .select-button .arrow, button.btn .select-button .arrow, *.button .select-button .arrow, *.btn-primary .select-button .arrow, *.btn-reject .select-button .arrow, .button .select-button .arrow, .btn-primary .select-button .arrow, .btn-reject .select-button .arrow, button.button .select-button .arrow, button.btn-primary .select-button .arrow, button.btn-reject .select-button .arrow { height: 22px; margin-left: 10px; } .btn .learn_more, *.btn .learn_more, button.btn .learn_more, *.button .learn_more, *.btn-primary .learn_more, *.btn-reject .learn_more, .button .learn_more, .btn-primary .learn_more, .btn-reject .learn_more, button.button .learn_more, button.btn-primary .learn_more, button.btn-reject .learn_more { display: inline-block; margin: 25px auto; } .btn .inputWithButton .squarebutton, *.btn .inputWithButton .squarebutton, button.btn .inputWithButton .squarebutton, *.button .inputWithButton .squarebutton, *.btn-primary .inputWithButton .squarebutton, *.btn-reject .inputWithButton .squarebutton, .button .inputWithButton .squarebutton, .btn-primary .inputWithButton .squarebutton, .btn-reject .inputWithButton .squarebutton, button.button .inputWithButton .squarebutton, button.btn-primary .inputWithButton .squarebutton, button.btn-reject .inputWithButton .squarebutton { flex-grow: 1; width: auto; margin: 0; } .btn .inputWithButton, *.btn .inputWithButton, button.btn .inputWithButton, *.button .inputWithButton, *.btn-primary .inputWithButton, *.btn-reject .inputWithButton, .button .inputWithButton, .btn-primary .inputWithButton, .btn-reject .inputWithButton, button.button .inputWithButton, button.btn-primary .inputWithButton, button.btn-reject .inputWithButton { display: flex; align-items: center; margin: 25px 0; } .btn .inputWithButton fieldset, *.btn .inputWithButton fieldset, button.btn .inputWithButton fieldset, *.button .inputWithButton fieldset, *.btn-primary .inputWithButton fieldset, *.btn-reject .inputWithButton fieldset, .button .inputWithButton fieldset, .btn-primary .inputWithButton fieldset, .btn-reject .inputWithButton fieldset, button.button .inputWithButton fieldset, button.btn-primary .inputWithButton fieldset, button.btn-reject .inputWithButton fieldset { flex-grow: 2; margin: 0; } .btn .inputWithButton fieldset input, *.btn .inputWithButton fieldset input, button.btn .inputWithButton fieldset input, *.button .inputWithButton fieldset input, *.btn-primary .inputWithButton fieldset input, *.btn-reject .inputWithButton fieldset input, .button .inputWithButton fieldset input, .btn-primary .inputWithButton fieldset input, .btn-reject .inputWithButton fieldset input, button.button .inputWithButton fieldset input, button.btn-primary .inputWithButton fieldset input, button.btn-reject .inputWithButton fieldset input { border-right: none; } .btn .login-buttons, *.btn .login-buttons, button.btn .login-buttons, *.button .login-buttons, *.btn-primary .login-buttons, *.btn-reject .login-buttons, .button .login-buttons, .btn-primary .login-buttons, .btn-reject .login-buttons, button.button .login-buttons, button.btn-primary .login-buttons, button.btn-reject .login-buttons { display: flex; align-items: center; } @media screen and (max-width: 600px) { .btn .select-button .label, *.btn .select-button .label, button.btn .select-button .label, *.button .select-button .label, *.btn-primary .select-button .label, *.btn-reject .select-button .label, .button .select-button .label, .btn-primary .select-button .label, .btn-reject .select-button .label, button.button .select-button .label, button.btn-primary .select-button .label, button.btn-reject .select-button .label { line-height: normal; } } .inputWithButton { display: flex; align-items: center; margin: 5px 0; } .inputWithButton > fieldset > input { border-bottom-left-radius: 0px; border-top-left-radius: 0px; } @media (min-width: 800px) { .inputWithButton > fieldset:not(:first-child) > input, .inputWithButton > fieldset:not(:first-of-type) > input { border-left: 0px; } } .inputWithButton > fieldset:first-child > input { border-radius: 4px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } .inputWithButton > fieldset:last-child > input { border-radius: 4px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .inputWithButton > fieldset:only-child > input { border-radius: 4px !important; } @media (min-width: 800px) { .inputWithButton > fieldset:not(:first-child) > input, .inputWithButton > fieldset:not(:first-of-type) > input { border-left: 0px; } } .select-buttons .select-button { width: 100%; background: #FFFFFF; } .select-buttons button:hover, .select-buttons button:focus, .select-buttons button:active { background: #285a8a; cursor: pointer; color: white; } .cancel-button { height: 40px; width: 40px; margin-right: 25px; display: inline-block; background: url("../../images/changepwd/cancel.svg") no-repeat; cursor: pointer; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ body { height: 100vh; font-family: "Open Sans", "Poppins", sans-serif; font-size: 16px; } @media (min-width: 600px) { body { background: linear-gradient(180deg, #98139C 0%, #4F0077 100%) !important; background-color: (#3F175D) ; } } main { display: flex; justify-content: center; } @media screen and (min-height: 700px) and (min-width: 800px) { main { align-items: flex-end; height: calc(100vh - 125px - 100px); } } @media screen and (min-height: 800px) and (min-width: 800px) { main { height: calc(100vh - 40vh); } } @media (min-width: 600px) and (min-height: 600px) { main { align-items: center; width: 800px; margin: auto; height: calc(100vh - 125px - 100px); } } main .card { background-color: #FFFFFF; background: #FFFFFF; width: 100%; display: flex; flex-direction: column; } @media (min-width: 600px) { main .card { border: 1px solid #285a8a; box-shadow: 4px 4px 4px 0px rgba(56, 56, 56, 0.3); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } } main .card .inner { display: flex; justify-content: space-between; flex-wrap: wrap; vertical-align: baseline; min-height: 500px; } @media (max-width: 600px) { main .card .inner { min-height: calc(100vh - 125px); } } #signin-wrapper { width: 325px; margin: auto; order: 2; padding: 20px 60px; display: flex; flex-direction: column; justify-content: center; } .actions, .forgot-password, .powered-by-advania { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; width: 100%; } .actions > form { max-height: calc(500px - 40px); overflow-y: auto; height: auto; } .info { overflow: auto; overflow-x: hidden; background: #285a8a; color: #FFFFFF; font-family: "Open Sans", sans-serif; font-size: 14px; font-weight: 400; line-height: 20px; letter-spacing: 0.33px; padding: 40px; justify-content: center; flex-direction: column; display: flex; width: 100%; order: 1; } .info h1, .info h2, .info a { font-weight: 600; letter-spacing: 0.2px; margin-bottom: 16px; } .info h1 { font-style: italic; font-size: 24px; line-height: 32px; } .info h2 { font-size: 14px; line-height: 20px; } .info a { color: #FFFFFF; font-weight: 600; margin-bottom: 5px; } .info a:hover, .info a:focus, .info a:active { color: #DDDDDD; } @media (min-width: 800px) { .info { flex: 1; order: 2; flex-grow: 3; } } .helptext { margin-top: 20px; font-weight: 600; font-size: 14px; line-height: 20px; letter-spacing: 0.2px; } @media (min-width: 800px) { #signin-wrapper.signin { flex: 2; order: 1; flex-grow: 3; } } @media (max-width: 30em) { body{ background-color: #fff!important; background:none; } header .logo { color: #333333!important; } #signin-wrapper { width: 100%; margin: auto; order: 2; padding: 20px; display: flex; flex-direction: column; justify-content: center; } .card { box-shadow: none; } .info { display: flex; order: 1; } fieldset { margin: 15px 0; } .info { padding: 10px 30px; } .password-validator { margin: 10px -30px; } .password-validator h2 { text-align: center; margin-bottom: 10px; } .validator-holder { display: flex; flex-wrap: wrap; width: 100%; justify-content: space-around; } .validator { display: block; margin: 5px auto; margin: 10px 5px; } .validator .indicator { height: 12px; width: 12px; margin-right: 8px; } .validator.hidden { display: none; } #in_progress, #confirmed { display: none; } } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ p, h1, h2, h3, h4, h5, h6 { font-family: inherit; -webkit-font-smoothing: antialiased; font-size: 14px; letter-spacing: 0.2px; } p.info-text, h1.info-text, h2.info-text, h3.info-text, h4.info-text, h5.info-text, h6.info-text { margin-bottom: 10px; } p.info-text.informative, h1.info-text.informative, h2.info-text.informative, h3.info-text.informative, h4.info-text.informative, h5.info-text.informative, h6.info-text.informative { font-weight: 900; margin-top: 20px; margin-bottom: 0px; } p.info-text a, h1.info-text a, h2.info-text a, h3.info-text a, h4.info-text a, h5.info-text a, h6.info-text a { background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 94%, #FFFFFF 94.1%, #FFFFFF 100%, rgba(0, 0, 0, 0) 100.1%, rgba(0, 0, 0, 0)) !important; text-decoration: none !important; font-weight: 800; cursor: pointer; } p.info-text a:hover, h1.info-text a:hover, h2.info-text a:hover, h3.info-text a:hover, h4.info-text a:hover, h5.info-text a:hover, h6.info-text a:hover { color: #DDDDDD; background-image: linear-gradient(180deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 94%, #DDDDDD 94.1%, #DDDDDD 100%, rgba(0, 0, 0, 0) 100.1%, rgba(0, 0, 0, 0)) !important; text-decoration: none !important; font-weight: 800; cursor: pointer; } p.info-text.info-text:not(:last-child).line:after, h1.info-text.info-text:not(:last-child).line:after, h2.info-text.info-text:not(:last-child).line:after, h3.info-text.info-text:not(:last-child).line:after, h4.info-text.info-text:not(:last-child).line:after, h5.info-text.info-text:not(:last-child).line:after, h6.info-text.info-text:not(:last-child).line:after { height: 10px; content: " "; width: 75%; margin: auto; border-bottom: solid 1px white; display: flex; } p.info-text.info-text:not(:last-child).line:empty, h1.info-text.info-text:not(:last-child).line:empty, h2.info-text.info-text:not(:last-child).line:empty, h3.info-text.info-text:not(:last-child).line:empty, h4.info-text.info-text:not(:last-child).line:empty, h5.info-text.info-text:not(:last-child).line:empty, h6.info-text.info-text:not(:last-child).line:empty { display: none; } h1.info-title { text-align: center; } h1.info-title.both { margin-top: 20px; } .info.error { background: #FFF; color: #444; } h1.info-title, .info h1 { font-size: 24px; margin-bottom: 25px; line-height: 24px; font-weight: 400; letter-spacing: 0.2px; font-style: normal; } .info-header { display: flex; flex-direction: column; position: relative; height: 55%; min-height: 100px; } @media (max-width: 500px) { .info-header { height: 200px; overflow: hidden; } } .info-header h1 { display: flex; width: 100%; flex: 1; justify-content: center; align-items: center; align-content: center; margin: auto; } .info-header h1.error-heading { font-weight: 900; color: #285a8a; font-size: 50px; } @media (min-width: 600px) { .info-header h1.error-heading { font-size: 100px; } } .info-header h1.error-subheading { font-weight: 900; color: #285a8a; border-bottom: solid 1px #285a8a; } .info-content { flex-basis: 100%; flex-direction: column; } div.row.icon-row { display: flex; margin-bottom: 10px; } .info div.row.icon-row { display: flex; margin-bottom: 25px; } .info div.row.icon-row div.col-xs-1 { display: inherit; padding: 5px; } .info div.row.icon-row div.col-xs-11 { font-weight: 400; font-size: 14px; -webkit-font-smoothing: antialiased; } .info div.row.icon-row div.col-xs-11 h1 { margin-bottom: 0px; padding: 5px; font-size: 16px; font-weight: 600; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ @font-face { font-family: 'Poppins'; src: url("../../../res/fonts/Poppins/Poppins-Regular.ttf"); font-style: normal; font-weight: normal; } @font-face { font-family: 'Poppins'; src: url("../../../res/fonts/Poppins/Poppins-Semibold.ttf"); font-style: normal; font-weight: 600; } @font-face { font-family: 'Open Sans'; src: url("../../../res/fonts/open_sans/OpenSans-Regular.ttf"); font-style: normal; font-weight: normal; } @font-face { font-family: 'Open Sans'; src: url("../../../res/fonts/open_sans/OpenSans-Bold.ttf"); font-style: normal; font-weight: 700; } @font-face { font-family: 'Open Sans'; src: url("../../../res/fonts/open_sans/OpenSans-Italic.ttf"); font-style: italic; font-weight: normal; } @font-face { font-family: 'Open Sans'; src: url("../../../res/fonts/open_sans/OpenSans-BoldItalic.ttf"); font-style: italic; font-weight: 700; } a, p, label, h1, h2, h3, h4, h5, h6 { font-family: "Open Sans", "Poppins", sans-serif; } .uppercase { text-transform: uppercase; } .lowercase { text-transform: lowercase; } .normal { font-weight: 400; } .light { font-weight: 300; } .bold { font-weight: 600; } .bolder { font-weight: 800; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ form { margin: 0; } form > *:last-child { margin-bottom: 0 !important; } .actions > fieldset, .actions > input, .actions > * { position: relative; font-size: 100%; font: inherit; vertical-align: baseline; width: 100%; height: 100%; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ fieldset.custom-select select { font-size: 16px; /* font-size is up to you, not required */ padding: 20px 10px; /* padding is up to you */ display: block; /* just to make sure display is block */ width: 100%; /* width is up to you */ box-sizing: border-box; background: white; border: 1px solid #f5f5f6; min-width: 300px; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ .inputgroup { background: transparent; } .inputgroup fieldset { position: relative; margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } .inputgroup fieldset input { font-size: 16px; padding: 20px 10px; display: block; width: 100%; box-sizing: border-box; background: white; border: 1px solid #F5F5F6; } .inputgroup fieldset label { position: absolute; font-family: "Open Sans", sans-serif; font-size: 16px; left: 10px; top: 22px; pointer-events: none; transition: 0.2s ease all; -moz-transition: 0.2s ease all; -webkit-transition: 0.2s ease all; color: #55646F; } .fieldset, fieldset { position: relative; margin: 25px 0px; width: 100%; } .fieldset input, fieldset input { font-size: 16px; /* font-size is up to you, not required */ padding: 20px 10px; /* padding is up to you */ display: block; /* just to make sure display is block */ width: 100%; /* width is up to you */ box-sizing: border-box; background: white; border: 2px solid #f5f5f6; border-radius: 4px; } .fieldset input:focus + label, .fieldset input:valid:not(:empty) + label, .fieldset input:disabled + label, .fieldset input:-webkit-autofill + label, fieldset input:focus + label, fieldset input:valid:not(:empty) + label, fieldset input:disabled + label, fieldset input:-webkit-autofill + label { top: 6px; /* where the label goes upon interaction */ font-size: 12px; /* font-size change on interaction */ } .fieldset label, fieldset label { position: absolute; display: flex; align-items: center; font-family: "Open Sans", sans-serif; font-size: 16px; left: 10px; /* determines space to left of label */ top: 22px; /* determines space above label */ pointer-events: none; /* enables click through on label */ transition: 0.2s ease all; /* determines animation during */ -moz-transition: 0.2s ease all; /* user interaction */ -webkit-transition: 0.2s ease all; color: #55646F; } .fieldset label, fieldset label img { margin-right: 1rem; } .fieldset input:focus ~ label, .fieldset input:valid:not(:empty) ~ label, .fieldset input:disabled ~ label, .fieldset input:-webkit-autofill ~ label, fieldset input:focus ~ label, fieldset input:valid:not(:empty) ~ label, fieldset input:disabled ~ label, fieldset input:-webkit-autofill ~ label, fieldset input:focus + label, fieldset input:valid:not(:empty) + label, fieldset input:disabled + label, fieldset input:-webkit-autofill + label { top: 6px; font-size: 12px; } .fieldset input:focus ~ label img, .fieldset input:valid:not(:empty) ~ label img, .fieldset input:disabled ~ label img, .fieldset input:-webkit-autofill ~ label img, fieldset input:focus ~ label img, fieldset input:valid:not(:empty) ~ label img, fieldset input:disabled ~ label img, fieldset input:-webkit-autofill ~ label img, fieldset input:focus + label img, fieldset input:valid:not(:empty) + label img, fieldset input:disabled + label img, fieldset input:-webkit-autofill + label img { width: 14px; height: 14px; } .has-value + label, fieldset input.has-value + label, fieldset input:focus + label, fieldset input.valid:not(:empty) + label { top: 6px; font-size: 12px; } .has-value + label img, fieldset input.has-value + label img, fieldset input:focus + label img, fieldset input.valid:not(:empty) + label img { width: 14px; height: 14px; } fieldset input:focus, fieldset input:active { -webkit-box-shadow: inset 2px 0px 0px 0px #3F175D!important; box-shadow: inset 2px 0px 0px 0px #3F175D!important; } input:focus, textarea:focus, select:focus, button:focus { outline: none; } input[type=password]::-ms-reveal, input[type=password]::-ms-clear { display: none; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ .checkbox { margin-left: -15px; padding: 20px 0; } .checkbox { margin-left: -15px; padding: 20px 0; } input + span { font-family: "Open Sans", sans-serif; font-size: 16px; color: #55646F; } input[type=checkbox]:focus + span:after, input[type=checkbox]:active + span:after { border: solid 2px #285a8a !important; } input[type="checkbox"] + label { background-image: url("../images/uncheck_blue.png"); background-repeat: no-repeat; height: 25px; display: inline-block; color: #285a8a; font-family: "Open Sans"; padding-left: 40px; padding-right: 25px; line-height: 25px; cursor: pointer; } input[type="checkbox"]:checked + label { background-image: url("../images/check_blue.png"); background-repeat: no-repeat; } input[type="checkbox"] { opacity: 0; } input[type="checkbox"]:hover + label, input[type="checkbox"]:active + label, input[type="checkbox"]:focus + label { text-decoration: underline; /* outline: auto; outline-color: -webkit-focus-ring-color; */ } .disabled input[type="checkbox"] + label { color: #bdbdbd; background-image: url("../images/uncheck_gray.png"); } .disabled input[type="checkbox"]:checked + label { background-image: url("../images/check_gray.png"); } .disabled input[type="checkbox"]:hover + label, .disabled input[type="checkbox"]:active + label, .disabled input[type="checkbox"]:focus + label { text-decoration: none; cursor: default; } input[type="checkbox"] + label { background-image: url("../../images/uncheck_blue.png"); color: #285a8a; background-repeat: no-repeat; height: 25px; display: inline-block; font-family: 'Open Sans'; padding-left: 35px; padding-right: 25px; line-height: 25px; cursor: pointer; } input[type="checkbox"]:checked + label { background-repeat: no-repeat; background-image: url("../../images/check_blue.png"); } input[type="checkbox"] { opacity: 0; } input[type="checkbox"]:hover + label, input[type="checkbox"]:active + label, input[type="checkbox"]:focus + label { text-decoration: underline; } .securitycode { display: none; } [type="radio"]:not(:checked), [type="radio"]:checked { position: absolute; opacity: 0; pointer-events: none; } [type="radio"]:not(:checked) + span, [type="radio"]:checked + span { position: relative; font-family: "Open Sans", sans-serif; font-size: 16px; color: #55646F; padding-left: 35px; cursor: pointer; display: inline-block; height: 25px; line-height: 25px; -webkit-transition: .28s ease; transition: .28s ease; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } [type="radio"] + span:before, [type="radio"] + span:after { content: ''; position: absolute; left: 0; top: 0; margin: 4px; width: 16px; height: 16px; z-index: 0; -webkit-transition: .28s ease; transition: .28s ease; } [type="radio"]:not(:checked) + span:before, [type="radio"]:not(:checked) + span:after, [type="radio"]:checked + span:before, [type="radio"]:checked + span:after, [type="radio"].with-gap:checked + span:before, [type="radio"].with-gap:checked + span:after { border-radius: 50%; } [type="radio"]:not(:checked) + span:before, [type="radio"]:not(:checked) + span:after { border: 2px solid #f5f5f6; } [type="radio"]:not(:checked) + span:after { -webkit-transform: scale(0); transform: scale(0); } [type="radio"]:checked + span:before { border: 2px solid transparent; } [type="radio"]:checked + span:after, [type="radio"].with-gap:checked + span:before, [type="radio"].with-gap:checked + span:after { border: 2px solid #285a8a; } [type="radio"]:checked + span:after, [type="radio"].with-gap:checked + span:after { background-color: #285a8a; } [type="radio"]:checked + span:after { -webkit-transform: scale(1.02); transform: scale(1.02); } [type="radio"].with-gap:checked + span:after { -webkit-transform: scale(0.5); transform: scale(0.5); } [type="radio"].tabbed:focus + span:before { -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1); } [type="radio"].with-gap:disabled:checked + span:before { border: 2px solid rgba(0, 0, 0, 0.42); } [type="radio"].with-gap:disabled:checked + span:after { border: none; background-color: rgba(0, 0, 0, 0.42); } [type="radio"]:disabled:not(:checked) + span:before, [type="radio"]:disabled:checked + span:before { background-color: transparent; border-color: rgba(0, 0, 0, 0.42); } [type="radio"]:disabled + span { color: rgba(0, 0, 0, 0.42); } [type="radio"]:disabled:not(:checked) + span:before { border-color: rgba(0, 0, 0, 0.42); } [type="radio"]:disabled:checked + span:after { background-color: rgba(0, 0, 0, 0.42); border-color: #949494; } [type="checkbox"]:not(:checked), [type="checkbox"]:checked { position: absolute; opacity: 0; pointer-events: none; } [type="checkbox"] + span:not(.lever) { position: relative; padding-left: 35px; cursor: pointer; display: inline-block; height: 25px; line-height: 25px; font-size: 1rem; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } [type="checkbox"] + span:not(.lever):before, [type="checkbox"]:not(.filled-in) + span:not(.lever):after { content: ''; position: absolute; top: 0; left: 0; width: 18px; height: 18px; z-index: 0; border: 2px solid #f5f5f6; border-radius: 1px; margin-top: 3px; -webkit-transition: .2s; transition: .2s; } [type="checkbox"]:not(.filled-in) + span:not(.lever):after { border: 0; -webkit-transform: scale(0); transform: scale(0); } [type="checkbox"]:not(:checked):disabled + span:not(.lever):before { border: none; background-color: rgba(0, 0, 0, 0.42); } [type="checkbox"].tabbed:focus + span:not(.lever):after { -webkit-transform: scale(1); transform: scale(1); border: 0; border-radius: 50%; -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1); background-color: rgba(0, 0, 0, 0.1); } [type="checkbox"]:checked + span:not(.lever):before { top: -4px; left: -5px; width: 12px; height: 22px; border-top: 2px solid transparent; border-left: 2px solid transparent; border-right: 2px solid #285a8a; border-bottom: 2px solid #285a8a; -webkit-transform: rotate(40deg); transform: rotate(40deg); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } [type="checkbox"]:checked:disabled + span:before { border-right: 2px solid rgba(0, 0, 0, 0.42); border-bottom: 2px solid rgba(0, 0, 0, 0.42); } [type="checkbox"]:indeterminate + span:not(.lever):before { top: -11px; left: -12px; width: 10px; height: 22px; border-top: none; border-left: none; border-right: 2px solid #285a8a; border-bottom: none; -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } [type="checkbox"]:indeterminate:disabled + span:not(.lever):before { border-right: 2px solid rgba(0, 0, 0, 0.42); background-color: transparent; } [type="checkbox"].filled-in + span:not(.lever):after { border-radius: 2px; } [type="checkbox"].filled-in + span:not(.lever):before, [type="checkbox"].filled-in + span:not(.lever):after { content: ''; left: 0; position: absolute; -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s; transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s; z-index: 1; } [type="checkbox"].filled-in:not(:checked) + span:not(.lever):before { width: 0; height: 0; border: 3px solid transparent; left: 6px; top: 10px; -webkit-transform: rotateZ(37deg); transform: rotateZ(37deg); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } [type="checkbox"].filled-in:not(:checked) + span:not(.lever):after { height: 20px; width: 20px; background-color: transparent; border: 2px solid #f5f5f6; top: 0px; z-index: 0; } [type="checkbox"].filled-in:checked + span:not(.lever):before { top: 0; left: 1px; width: 6px; height: 13px; border-top: 2px solid transparent; border-left: 2px solid transparent; border-right: 2px solid #fff; border-bottom: 2px solid #fff; -webkit-transform: rotateZ(37deg); transform: rotateZ(37deg); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } [type="checkbox"].filled-in:checked + span:not(.lever):after { top: 0; width: 20px; height: 20px; border: 2px solid #285a8a; background-color: #285a8a; z-index: 0; } [type="checkbox"].filled-in.tabbed:focus + span:not(.lever):after { border-radius: 2px; border-color: #f5f5f6; background-color: rgba(0, 0, 0, 0.1); } [type="checkbox"].filled-in.tabbed:checked:focus + span:not(.lever):after { border-radius: 2px; background-color: #285a8a; border-color: #285a8a; } [type="checkbox"].filled-in:disabled:not(:checked) + span:not(.lever):before { background-color: transparent; border: 2px solid transparent; } [type="checkbox"].filled-in:disabled:not(:checked) + span:not(.lever):after { border-color: transparent; background-color: #949494; } [type="checkbox"].filled-in:disabled:checked + span:not(.lever):before { background-color: transparent; } [type="checkbox"].filled-in:disabled:checked + span:not(.lever):after { background-color: #949494; border-color: #949494; font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ fieldset input.has-error, fieldset input.has-error { border: 1px solid #f8d7da; } fieldset input.has-error:focus, fieldset input.has-error:active, fieldset input.has-error:focus, fieldset input.has-error:active { border: 2px solid #f5f5f6; } input[type=checkbox].has-error:focus, input[type=checkbox].has-error:active { color: #55646F; } input[type=checkbox].has-error:focus span:after, input[type=checkbox].has-error:active span:after { border: 2px solid #f5f5f6 !important; } input[type=checkbox].has-error + span { color: #f8d7da; } input[type=checkbox].has-error + span:after { border: solid 2px #f8d7da !important; } .validator + .elipse-loading { display: none; } .validator.hidden.invalid .indicator { background: url("../../images/icons/uncheck-circle-grey.svg") no-repeat !important; } .validator.hidden + .elipse-loading { display: inline-block; font-size: 56px; width: 174px; text-align: left; } .info .start { vertical-align: top; text-align: center; } .login-buttons { display: flex; align-items: center; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ .error-holder { font-family: "Open Sans", sans-serif; background: #e60000; color: #ffffff; padding: 5px; margin-top: 25px; height: 48px; margin: auto; vertical-align: bottom; display: flex; justify-content: center; align-items: center; padding: 20px 15px; margin-bottom: 25px; position: relative; width: auto; } .error-holder.hidden { display: none; } .alert-danger { color: red; font-family: "Open Sans", sans-serif; font-size: 16px; line-height: 24px; letter-spacing: 0.2px; height: auto; } .alert-danger.hidden { display: none; } .validator { margin: 5px; display: flex; align-items: center; } .validator.hidden.invalid { display: none; } .validator .indicator, .validator.valid.hidden .indicator { height: 25px; width: 25px; margin-right: 18px; display: inline-block; background: url("../../images/uncheck.png") no-repeat; flex-shrink: 0; } .validator.invalid .indicator { background: url("../../images/changepwd/disapprove.svg") no-repeat; } .validator.valid .indicator { background: url("../../images/changepwd/approve.svg") no-repeat; } .possibleCaptcha { display: flex; justify-content: center; } .possibleCaptcha .checkbox { padding: 0; } .polling .waiting { background-image: url("../../images/uncheck.png"); } .polling .waiting-done { background-image: url("../../images/check.png"); } .progress { display: flex; align-items: center; margin: 20px auto; } .waiting { display: inline-block; background-image: url("../../images/uncheck_blue.png"); background-repeat: no-repeat; height: 25px; width: 25px; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; } .validator .text { display: inline-block; width: 70%; margin-left: 18px; } .waiting-done { background-image: url("../../images/check_blue.png"); background-repeat: no-repeat; } .toggle-visibility { position: absolute; top: 25px; right: 25px; height: 20px; width: 20px; display: inline-block; background: url("../../images/changepwd/show.svg") no-repeat; cursor: pointer; } .toggle-visibility.showing { background: url("../../images/changepwd/hide.svg") no-repeat; top: 22px; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ .phone-img { background: url(../images/changepwd/iphone8-ppss.png); vertical-align: middle; height: 204px; width: 174px; margin: 0 auto 15px auto; background-repeat: no-repeat; display: inline-block; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; display: block; } .phone-img.pocket-pass { background: url(../images/changepwd/iphone8-pocketpass.png); background-repeat: no-repeat; display: inline-block; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; vertical-align: middle; } span.info-icon-header { display: flex; height: 100%; min-width: 100%; width: 100%; justify-content: center; align-items: center; vertical-align: middle; background: url(../../images/icons/bird-pas-icon.png) no-repeat center; -webkit-background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%; background-size: auto 100%; } img.info-icon-header { display: flex; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); height: 100%; width: auto; margin: auto; justify-content: center; align-items: center; vertical-align: middle; object-fit: scale-down; } img.info-icon-header[src=""], img.info-icon-header[src="res/images/backgrounds/transparent.png"], img.info-icon-header[src="res/images/icons/bird-pas-icon.png"], img.info-icon-header[src="authenticate/res/images/backgrounds/transparent.png"], img.info-icon-header[src='/authenticate/res/images/backgrounds/transparent.png'] { background: url(../../images/icons/bird-pas-icon.png) no-repeat center; content: url("../../images/backgrounds/transparent.png"); background-size: auto 100%; } /* This CSS is generated by PhenixID Framework version 2.8 in February 2019. */ .dropdown { line-height: 24px; font-family: "Open Sans", sans-serif; font-size: 16px; letter-spacing: 0.2px; color: #55646F; -webkit-font-smoothing: antialiased; text-decoration: none; display: inline-block; margin: auto; position: relative; padding: 3px 0; } .dropdown a { color: #FFFFFF; } .dropdown-toggle { -webkit-font-smoothing: antialiased; padding: 0.5rem 1rem; } .dropdown-toggle::after { display: inline-block; width: 0; height: 0; margin-left: 0.255em; vertical-align: 0.255em; content: ""; border-top: 0.3em solid; border-right: 0.3em solid transparent; border-bottom: 0; border-left: 0.3em solid transparent; } .dropdown-menu { position: absolute; top: 100%; float: left; min-width: 10rem; margin: 0.125rem 0 0; font-size: 16px; color: #444444; background-color: #FFFFFF; background-clip: padding-box; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.25rem; } .dropdown-menu li a { display: block; -webkit-font-smoothing: antialiased; text-align: center; padding: 10px 0; border-bottom: 1px solid rgba(0, 0, 0, 0.15); font-weight: 400; margin: 0; color: #fff!important; } .dropdown-menu li a:hover, .dropdown-menu li a:focus, .dropdown-menu li a:active { background: #CB0084!important; color: #FFFFFF; } .dropdown-toggle { cursor: pointer; } .dropdown-menu { position: absolute; background: #CB0084!important; padding: 20px 75px 20px 25px; margin-top: 25px; right: 0; } .dropdown-menu.show { display: block; } .dropdown-menu a { text-decoration: none; cursor: pointer; color: #444444; margin-bottom: 5px; display: inline-block; padding: 5px 0; } div.custom-dropdown { position: relative; border: 1px solid #ededed; background: #FFFFFF; line-height: 45px; font-family: "Open Sans", sans-serif; font-size: 16px; text-decoration: none; font-weight: 400; padding: 5px 10px; margin: 20px 0; display: flex; justify-content: space-between; } div.custom-dropdown:hover { color: black; background: #eaeaea; cursor: pointer; } .custom-dropdown-text { display: flex; align-items: center; justify-content: space-between; } div.custom-dropdown .custom-list { width: 100%; position: absolute; left: 10px; overflow-y: auto; max-height: 250px; background: #FFFFFF; } div.custom-dropdown .custom-list .custom-list-item { border: 1px solid #ededed; font-family: "Open Sans"; font-size: 13px; line-height: normal; letter-spacing: 0.33px; color: #444444; text-decoration: none; font-weight: 400; padding: 5px 10px; display: flex; align-items: center; justify-content: space-between; min-height: 36px; } div.custom-dropdown .custom-list.hidden { display: none !important; } div.custom-dropdown .custom-list .custom-list-item:not(:first-child) { border-top: 0px; } .custom-list-item:hover { background: #4183c4; color: #FFFFFF; } .custom-list-item:hover .arrow, .custom-list-item:hover .label { color: #FFFFFF; } .custom-list-item .methodimage, .custom-list-item .placeholder { width: 30px; height: 30px; display: inline-block; margin-right: 20px; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background: #285a8a; } .custom-list-item .label { display: flex; width: 100%; align-items: center; } .custom-list-item .label span { margin: 0px 18px; } .custom-dropdown-text { width: 100%; } .custom-dropdown-text span.caret { float: right; } .dropdown-menu { z-index: 100000; padding: 0px; } .dropdown-menu li a { padding: 10px 50px; margin: 0; } .inputWithButton { display: flex; align-items: center; margin: 5px 0; } .inputWithButton > fieldset > .actions-dropdown > .custom-dropdown { border-bottom-left-radius: 0px; border-top-left-radius: 0px; max-height: 60px; margin: 5px 0; border: 1px solid #f5f5f6; } .inputWithButton > fieldset:not(:first-child) > .actions-dropdown > .custom-dropdown, .inputWithButton > fieldset:not(:first-of-type) > .actions-dropdown > .custom-dropdown { border-left: 0px; } .inputWithButton > fieldset:first-child > .actions-dropdown > .custom-dropdown { border-radius: 4px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; } .inputWithButton > fieldset:last-child > .actions-dropdown > .custom-dropdown { border-radius: 4px; border-top-left-radius: 0px; border-bottom-left-radius: 0px; } .inputWithButton > fieldset:only-child > .actions-dropdown > .custom-dropdown { border-radius: 4px !important; } .inputWithButton > fieldset:not(:first-child), .inputWithButton > fieldset:not(:first-of-type) { border-left: 0px; } @media (max-width: 600px) { .dropdown-menu { margin-top: 3px; } div.custom-dropdown { line-height: normal; padding: 10px 20px; } } div.custom-dropdown { height: 48px; } div.custom-dropdown { border: 1px solid #ededed; background: #ffffff; position: relative; font-family: "Open Sans"; font-size: 13px; line-height: 45px; color: #444444; text-decoration: none; font-weight: 400; padding: 5px 10px; margin: 20px 0; display: flex; justify-content: space-between; } @media screen and (max-width: 600px) { div.custom-dropdown { line-height: normal; padding: 20px 10px; } .select-button .label { line-height: normal; font-family: "Open Sans", sans-serif; } } div.custom-dropdown:hover { color: black; background: #eaeaea; cursor: pointer; } .custom-dropdown-text { display: flex; align-items: center; justify-content: space-between; } div.custom-dropdown .custom-list { width: 100%; position: absolute; left: 10px; overflow-y: auto; max-height: 250px; font-family: "Open Sans", sans-serif !important; background: #ffffff; z-index: 1; } div.custom-dropdown .custom-list .custom-list-item { border: 1px solid #ededed; font-family: "Open Sans"; font-size: 16px; line-height: normal; letter-spacing: 0.33px; color: #444444; text-decoration: none; font-weight: 400; padding: 5px 10px; display: flex; align-items: center; justify-content: space-between; min-height: 36px; } div.custom-dropdown .custom-list.hidden { display: none !important; } div.custom-dropdown .custom-list .custom-list-item:not(:first-child) { border-top: 0px; } .custom-list-item:hover { background: #4183c4; color: #ffffff !important; } .custom-list-item:hover .arrow, .custom-list-item:hover .label { color: #ffffff !important; } .custom-list-item .methodimage, .custom-list-item .placeholder { width: 30px; height: 30px; display: inline-block; margin-right: 20px; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background: #285a8a; } .custom-list-item .label { display: flex; font-family: "Open Sans", sans-serif; width: 100%; align-items: center; } .custom-list-item .label span { margin: 0px 18px; } .custom-dropdown-text { width: 100%; font-family: "Open Sans", sans-serif; } .custom-dropdown-text span.caret { float: right; display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 600px) { div.custom-dropdown { padding-left: 20px; padding-right: 20px; } .select-button .label { line-height: normal; } } /* This CSS is generated by PhenixID Framework version 2.8 in September 2018. */ /* The file imports */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* sass sheet variables */ /* This CSS is generated by PhenixID Framework version 2.8 in September 2018. */ /* This CSS is generated by PhenixID Framework version 1.0 in September 2018. */ /* sass sheet variables */ @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Regular.ttf"); font-style: normal; font-weight: normal; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Bold.ttf"); font-style: normal; font-weight: 700; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-Italic.ttf"); font-style: italic; font-weight: normal; } @font-face { font-family: "Open Sans"; src: url("/authenticate/res/fonts/open_sans/OpenSans-BoldItalic.ttf"); font-style: italic; font-weight: 700; } /* The default classes are bellow */ /* The default classes are bellow */ /* The default classes are bellow */ header.top { height: 125px; width: auto; width: auto; margin: auto; padding: 0 50px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; max-width: 1200px; } header .logo { background: none!important; font-size: 1.5rem; color: #ffff; background-repeat: no-repeat; display: inline-block; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; height: 50px; margin: 25px auto 25px 0; height: 41px; width: 170px; } header .right { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; margin: auto 0 auto auto; } @media (max-width: 600px) { header .logo, header .right { margin: 4rem auto auto 5rem!important; } } @media (min-width: 800px) { header .top { height: 125px; } header .logo, header .right, header .logo { margin: 25px 0; } } .btn-primary { background: #CB0084!important; color: #FFFFFF; } .btn-primary:hover, .btn-primary:active, .btn-primary:focus { text-decoration: none; } .btn-primary.light { opacity: .8; } .btn-primary.light:hover { opacity: 1; } .btn-primary.dark { opacity: 1; } .btn-primary.dark:hover { opacity: .8; } .btn-reject { background: #FFFF; border: 1px solid #dc3545; color: #dc3545; } .btn-reject:hover, .btn-reject:active, .btn-reject:focus { text-decoration: none; } .btn-reject.light { opacity: .8; } .btn-reject.light:hover { opacity: 1; } .btn-reject.dark { opacity: 1; } .btn-reject.dark:hover { opacity: .8; } .forgot-password a{ text-decoration: none; cursor: pointer; color:#4F4F4F; } .login-heading{ display: flex; justify-content: center; } .login-heading h1{ color: #333333; font-weight: 700; font-size: 2rem; }