﻿.ui-mobile body { margin: 0; font-family: sans-serif; background: #f5f7fb; display: flex; align-items: center; justify-content: center; /*min-height: 100vh;*/ min-height: fit-content; }

.pdonlineMod_mumuLoginSaaSF24 { width: 100%; max-width: 35rem; /*display: table-cell; vertical-align: middle;*/ }

.login-card,
.register-card,
.change-password-card,
.reset-password-card,
.change-password-request-card { background: #fff; padding: 2rem; border-radius: 1rem; box-shadow: 0 0.375rem 1.125rem rgba(0,0,0,.15); }
    .login-card h1,
    .register-card h1,
    .change-password-card h1,
    .reset-password-card h1,
    .change-password-request-card h1 { margin: 0 0 1.25rem; font-size: 1.25rem; font-weight: bold; color: #2f65ff; text-align: center; }
    .login-card label,
    .register-card label,
    .change-password-card label,
    .reset-password-card label,
    .change-password-request-card label { display: block; font-size: 0.9rem; margin-bottom: 0.375rem; color: #333; }
    .login-card input,
    .register-card input,
    .change-password-card input,
    .reset-password-card input,
    .change-password-request-card input { width: 100%; padding: 10px 12px; margin-bottom: 1rem; border: 1px solid #ccc; border-radius: 0.375rem; font-size: 0.9rem; }
    .login-card .btn,
    .register-card .btn,
    .change-password-card .btn,
    .reset-password-card .btn,
    .change-password-request-card .btn { width: 100%; padding: 12px; border: 0; border-radius: 0.375rem; font-weight: 600; font-size: 1rem; cursor: pointer; }
    .login-card .btn.primary,
    .register-card .btn.primary,
    .change-password-card .btn.primary,
    .reset-password-card .btn.primary,
    .change-password-request-card .btn.primary { background: #2f65ff; color: #fff; }
    .login-card .btn.secondary,
    .register-card .btn.secondary,
    .change-password-card .btn.secondary,
    .reset-password-card .btn.secondary,
    .change-password-request-card .btn.secondary { background-color: #efefef; color: #333; }
    .login-card .links,
    .register-card .links,
    .change-password-card .links,
    .reset-password-card .links,
    .change-password-request-card .links { text-align: center; margin-top: 14px; font-size: 0.8rem; }
    .login-card .links a,
    .register-card .links a,
    .change-password-card .links a,
    .reset-password-card .links a,
    .change-password-request-card .links a { color: #2f65ff; text-decoration: none; }
    .login-card .links a:hover,
    .register-card .links a:hover,
    .change-password-card .links a:hover,
    .reset-password-card .links a:hover,
    .change-password-request-card .links a:hover { text-decoration: underline; }
    .register-card .note { text-align: center; margin-top: 14px; font-size: 13px; color: #333 }

    .login-card .ui-input-text:after, .login-card .ui-input-search:after,
    .register-card .ui-input-text:after, .register-card .ui-input-search:after,
    .change-password-card .ui-input-text:after, .change-password-card .ui-input-search:after,
    .reset-password-card .ui-input-text:after, .reset-password-card .ui-input-search:after,
    .change-password-request-card .ui-input-text:after, .change-password-request-card .ui-input-search:after { height: 0; width: 0; }

.ui-mobile [data-role=page], .ui-mobile [data-role=dialog], .ui-page { position: inherit; display: table; min-height: auto !important; max-width: 35rem; width: 100%; }

.ui-loading .ui-loader { display: none; }
.ui-mobile label { cursor: default; }

.hide { display: none; }

body .ui-menu { list-style: none; padding: 0; margin: 0; outline: none; /*border-radius: 0.375rem;*/ }
body .ui-autocomplete { position: absolute !important; /*top: 0; left: 0;*/ cursor: default; max-width: calc(35rem - 4rem); right: unset; bottom: unset; }
body .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.ui-menu-item:hover { background: #fff url(../../img/jqueryui/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; }
/*{ border: 1px solid #999; background: #343434 url("../../img/jqueryui/ui-bg_glass_5_343434_1x400.png") 50% 50% repeat-x; font-weight: normal; color: #FFF!important; }*/
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active { border: none!important; background: none!important; }
/*.ui-state-hover, 
.ui-widget-content .ui-state-hover, 
.ui-widget-header .ui-state-hover, 
.ui-state-focus, 
.ui-widget-content .ui-state-focus, 
.ui-widget-header .ui-state-focus { border: 1px solid #999; background: #343434 url("../../img/jqueryui/ui-bg_glass_5_343434_1x400.png") 50% 50% repeat-x; font-weight: normal; color: #FFF */}

.customOverlay { display: none; position: fixed; top: 0; left: 0; background: rgba(171, 171, 171, 0.53); width: 100%; height: 100%; z-index: 9999; }
.customOverlayForgot { display: none; position: fixed; top: 0; background: rgba(171, 171, 171, 0.53); width: 35rem; height: 100%; z-index: 9999; left: 50%; margin-left: -17.5rem; }
.customOverlayWithButtons { display: none; position: fixed; top: 0; left: 0; background: rgba(171, 171, 171, 0.53); width: 100%; height: 100%; z-index: 9999; }

/*#03A9F4*/ .customOverlayWithButtons { display: none; position: fixed; top: 0; left: 0; background: rgba(171, 171, 171, 0.53); width: 100%; height: 100%; z-index: 9999; }
.customDialogWithButtons, .customDialog { position: absolute; background: #fff; border-radius: 4px; padding: 0 0 1em 0; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 30%; text-align: center; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
    .customDialogWithButtons .customBtn { cursor: pointer; padding: 0.4em; color: #fff; background: #2f65ff; width: 48%; text-align: center; border-radius: 2px; box-sizing: border-box; float: left; }
    .customDialog .customBtn { cursor: pointer; padding: 0.4em; color: #fff; background: #2f65ff; width: 48%; text-align: center; border-radius: 2px; box-sizing: border-box; margin: auto; }
    .customDialogWithButtons .customBtn.IDno { margin-left: 4%; }
.customBtnContainerWithButtons { margin-top: 1em; width: 80%; margin: auto; padding: 1.5em 0; }
.customDialogWithButtons h4, .customDialog h4 { background: #2f65ff; margin-top: 0; padding: 0.6em; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #fff; }
.customDialogWithButtons h2, .customDialog h2 { margin: 0; }
.customDialogWithButtons p, .customDialog p { margin-top: 0; }



.customDialogForgot .customBtnForgot { cursor: pointer; padding: 0.4em; color: #fff; background: #2f65ff; width: 35%; margin: auto; text-align: center; border-radius: 2px; }
.customOverlayForgot { display: none; position: fixed; top: 0; background: rgba(171, 171, 171, 0.53); width: 35rem; height: 100%; z-index: 9999; left: 50%; margin-left: -17.5rem; }
.customDialogForgot { position: absolute; background: #fff; border-radius: 4px; padding: 0 0 1em 0; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 95%; text-align: center; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
    .customDialogForgot .customBtn { cursor: pointer; padding: 0.4em; color: #fff; background: #2f65ff; width: 35%; margin: auto; text-align: center; border-radius: 2px; }
    .customDialogForgot h4 { background: #2f65ff; margin-top: 0; padding: 0.4em; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #fff; }


.customDialog .customBtn,
.customDialog h4,
.customDialogWithButtons h4,
.customDialogWithButtons .customBtn { background-color: #2f65ff; }

.IDpasswordContainer { position: relative; }
    .IDpasswordContainer .IDshowHidePasswordIcons { position: absolute; top: 0; right: 12px; line-height: 40px; cursor: pointer; }

    @media only screen and (max-width: 768px) { .customDialogWithButtons, .customDialog { width: 95%; }
    .customOverlayForgot { left: 0; margin-left: 0; width: 100%; }
}
