.contain { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; top: 0; left: 0; position: fixed; }

#signin-modal { display: block;position: fixed;top:0;left:0;height:100%;width:100%;z-index: 999; }
#signin-modal p { text-align: left; line-height: 1.15 }
#signin-modal *:not(i) { font-family: 'europa', 'helvetica', 'arial', sans-serif; }
#signin-modal img { user-select:none; -webkit-user-drag:none }
#signin-flexbox { display:flex; position:fixed; height:100%; width:100%; align-items:center; justify-content:center }
#signin-container { 
    position:absolute; 
    width:80%;
    max-width:600px; 
    max-height:calc(100vh - 20px); 
    font-size: 24px;text-align: center; 
    color:#333; 
    background:#fefefe; 
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19); 
    border-radius: 10px; 
    padding:40px; 
    overflow:hidden auto;
}

.tooltip { z-index:30000; }
#signin-container.bookPreview { max-width:1234px; }
#signin-container.bookPreview table { height:300px }
/*#signin-container.bookPreview hr { display: none }*/
#signin-container #findMyButtons button { margin:0 0 20px 0 }
#signin-container.bookPreview #findMyButtons button { margin:0 0 10px 0 }

#signin-logo { display: flex; align-items: center; justify-content: center; }
#signin-logo img { max-height: 100px; object-fit: contain; }
#logo-subtext { width:100%;color: red; padding: 20px 0; }

#signin-modal .text-secondary { color:var(--shadow) !important; opacity:.85 }
#signin-modal table { position: relative; width:100%; box-sizing:content-box}
#signin-modal table th { padding: 0; font-weight: normal }
#signin-modal label { display:block; font-size:20px; font-weight:bold; width: 100%; text-align: left; padding-bottom: 0px; margin:0; color:#333; user-select: none }
#signin-modal label#schoolName { text-align:center; font-weight:bold; line-height:1; font-size:25px; color:#333; user-select:auto; padding-bottom:40px; }
#signin-modal input:not([type='checkbox']), 
#signin-modal select { display: block; width: 100%; height:40px; font-size: 20px;border-radius: 10px;border: 1px solid var(--shadow); color:#000; background:#fff; padding: 2px 8px; }
#signin-modal .passwordToggle + i { font-size:20px; position:absolute; margin:0; padding:10px; cursor:pointer; right:0; z-index:3 }
#signin-modal .passwordToggle + i:active { transform: scale(0.9) }
#signin-modal #forgotpassword { color:var(--shadow); position:absolute; right:0; }

#signin-modal form > div { width:100%; padding-bottom:20px; margin:0 }
#signin-modal table td { padding:0 }
#signin-modal table a { font-size: 16px; cursor: pointer; color: #333; text-decoration: none }
#signin-modal table a:hover { text-decoration: underline; opacity: 1 }

#signin-modal button[type='submit'] { margin:20px 0; line-height:normal; box-shadow: -2px 2px 10px #33333340; }
#signin-modal button[type='submit']:focus { outline:none !important }
#signin-modal button[type='submit'].clicked { pointer-events:none !important; opacity:0.9; }

button { background:var(--navy); color:white; padding: 12px 20px; border:none; font-size:20px; font-weight:bold; margin-top:20px; user-select: none; border-radius: 10px; line-height: 1 }
button:hover { background:var(--navy); opacity: .9 }
button.outline { background:none; color:var(--navy); border:2px solid var(--navy); padding: 10px 20px; font-weight: normal }
button.outline:hover { background:var(--navy); color:#fff; }
button.disabled { background:#ddd; color: white; padding: 12px 20px; border: none; pointer-events:none; }
button:active { transform: scale(.97) }

.fathom-modal ::-webkit-scrollbar { width: 13px; border-radius: 10px; }
.fathom-modal ::-webkit-scrollbar-track { background: #ebebeb; border-radius: 10px }
.fathom-modal ::-webkit-scrollbar-thumb { background: #cdcdcd; border-radius: 10px }
.fathom-modal ::-webkit-scrollbar-thumb:hover { background: #c0c0c0;}

@media only screen and (max-width: 900px) {
    #signin-modal { background: rgba(254,254,254,0.9) }
    #signin-container { background:none; box-shadow: none; padding:20px; width:100%; max-width:600px !important }
    #signin-container table tr td:not(:first-child) { display:none }
}

#signInMethod button { margin-top:0 !important; padding:8px 10px; font-size:16px; border-width:1px; border-color:#333; color:#333; font-weight:bold; transform:none }
#signInMethod button:hover, #signInMethod button:focus-visible { background:#f2f2f2 !important }
#signInMethod .dropdown-menu { border:0; box-shadow:0 0 6px #33333360 }
#signInMethod .dropdown-menu a { opacity:1; font-weight:bold; text-decoration:none !important; }
#signInMethod .dropdown-menu a:hover { background-color:#f2f2f2 }
#signInMethod .dropdown-menu a.disabled { box-shadow:inset 0 0 8px #33333340 }
#signInMethod .dropdown-header { padding:0.25rem 1.0rem; font-size:14px; color:var(--ocean); opacity:.85; user-select:none; }
#signInMethod .dropdown-item { padding:0.25rem 1.0rem; }
#signInMethod i { width:20px; margin-right:10px; text-align:center; }

#signin_icons { display:flex; justify-content:center; }
#signin_icons a { width:44px; height:44px; margin:0 8px; padding:4px; background:#fff; border-radius:4px; box-shadow:0 0 6px #33333360 }
#signin_icons img { width:100%; height:100%; margin:0 }

.lookup-item-list {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    float: left;
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0.125rem 0 0;
    font-size: 0.85rem;
    color: #858796;
    text-align: left;
    list-style: none;
    background-color: #fff;
    border-radius: 0.35rem;
    overflow-y:auto; 
    max-height:300px; 
    width:100%;
    border:0;
    box-shadow:0 0 6px #33333360
}

.lookup-item {
    display: block;
    width: 100%;
    padding: 0.25rem 1.5rem;
    clear: both;
    font-weight: 400;
    color: #3a3b45;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;   
}
.lookup-item:hover { background:#f2f2f2; text-decoration:none !important; }
.lookup-item.disabled { pointer-events:none }

.lookup-item-section {
    position: relative;
}

.credential-category {
    font-size: 14px;
    text-transform: uppercase;
    color: var(--ocean);
    position: absolute;
    top: -12px;
    padding-bottom: 6px;
    left: 0;
    width: 100%;
    opacity:.85;
}

#supportButton, #feedbackButton {position: fixed;right: -45px;width: 86px;height:40px;background: #505050cc;border-radius: 10px 10px 0 0;bottom: 7%;color: #fff;line-height: 1;padding: 10px;font-size: 20px;transform: rotate(-90deg);font-weight: normal;box-shadow: 0 2px 100px 10px rgba(255,255,255,0.5), 0 2px 4px 1px rgba(0,0,0,0.5);user-select: none;cursor: pointer;transition:.1s ease;border: 2px solid #ffffff60;z-index:99999;box-sizing: content-box;}
#supportButton { bottom:80px; right: -12px; width: 20px; }
#supportButton:hover, #feedbackButton:hover {background:#333333cc;margin-right:8px; }