#navigation, #left, #dashboard-cats-wrap, .task > .box-title > .copy-link.visible { display: none; }

#cellect-bar { height: 78px; display: flex; align-items: center; padding: 0 40px; border-bottom: solid 2px #aaa; background: #2588CB; }
    #cellect-bar > .logo { margin: 0 30px 0 0px; }
    #cellect-bar > .org-logo { border-left: solid 2px white; padding-left: 32px; }
    #cellect-bar > .r { margin-left: auto; }
    #cellect-bar > .i-link-w { display: flex; }
        #cellect-bar > .i-link-w > .i-link { position: relative; }
            #cellect-bar > .i-link-w > .i-link > .c { cursor: pointer; display: flex; flex-direction: column; align-items: center; height: 52px; color: white; font-size: 15px; }
                #cellect-bar > .i-link-w > .i-link > .c:hover { opacity: .8; }
                #cellect-bar > .i-link-w > .i-link > .c > .i { margin: auto; }
            #cellect-bar > .i-link-w > .i-link:not(:last-child) { margin-right: 50px; }
            #cellect-bar > .i-link-w > .i-link.open > .dropdown-menu { display: block; }


#cellect-intro { padding: 80px 40px; background: url(/res/img/cellect/bg.jpg) center/cover; }
    #cellect-intro > .c { max-width: 1400px; margin: 0 auto; display: flex; align-items: center; }
        #cellect-intro > .c > .img { /* background: url(/res/img/cellect/person.jpg) center/cover; */ flex: none; /* padding-bottom: 25%; */ margin-right: 68px; }
        #cellect-intro > .c > .r { flex: 2; color: white; }
            #cellect-intro > .c > .r > h2 { font-weight: bold; font-size: 52px; margin-top: 0; }
            #cellect-intro > .c > .r > .subtitle { font-size: 28px; }
            #cellect-intro > .c > .r > .read { border: solid 1px white; background: no-repeat; color: white; margin-top: 30px; border-radius: 4px; font-weight: bold; padding: 10px 20px; text-decoration: none; display: inline-block; }
                #cellect-intro > .c > .r > .read:hover { opacity: .8; }
    #cellect-intro > .shrink { position: absolute; top: 5px; right: 15px; color: white; font-size: 30px; cursor: pointer; }
    #cellect-intro.shrunk { padding: 10px 40px; }
        #cellect-intro.shrunk > .c > .l, #cellect-intro.shrunk > .c > .r > .subtitle, #cellect-intro.shrunk > .c > .r > .read { display: none; }
        #cellect-intro.shrunk > .c > .r > h2 { font-size: 28px; margin-bottom: 0; }


#dashboard-grid-wrap { min-height: 500px; }
#content > div { background: #F4F4F4; }
.task-topr-link { background: #C1E2F5; text-transform: capitalize; border-radius: 4px; padding: 5px 10px; color: #2E6180; font-size: 13px; margin-right: 10px; }
.theme-blue .btn.btn-primary, .theme-blue .btn { background: #C1E2F5; color: #2E6180; border-radius: 4px; }
.btn:hover { opacity: 0.8; background: #C1E2F5; }

.box.task > .box-title { border: none; }
    .box.task > .box-title > .flag { display: none; }
    .box.task > .box-title > h3 { font-family: 'Open Sans', sans-serif; font-weight: 600; color: #555; padding: 15px 0; margin: 0; }
        .box.task > .box-title > h3 > small { margin-left: 10px; color: #555; }
    .box.task > .box-title > .tab-inner-close-icon { font-size: 22px; color: #555555; }
.box.task > .box-content { background: none; padding: 0; }
    .box.task > .box-content > .tabs { margin-bottom: 0; }
        .box.task > .box-content > .tabs > .btn { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
            .box.task > .box-content > .tabs > .btn.active { background: white; }
    .box.task > .box-content > .tab-content { background: white; padding: 0 18px; }
        .box.task > .box-content > .tab-content .tab-pane { padding: 30px 0; }
            .box.task > .box-content > .tab-content .tab-pane .search-req-results-l > .tbl > .h { top: -30px; }

.stepflow > .btns { margin-top: 40px; margin-bottom: 10px; }
.tab-pane table.dataTable > thead > tr > th { top: -31px; }

.box.search-tab-content > .box-content { margin-bottom: 20px; padding: 20px 20px; }
.stepflow-search .child-row > td > table > tbody > tr > td { border-top-color: black; }
.results-table-w { margin: 0 -20px; }
.results-table > thead > tr > th { background: #E0E1E3; }
.results-table > tbody > tr > td { border-bottom: solid 1px #d5d5d5; }
    .results-table > tbody > tr > td:not(:last-child) { border-right: solid 1px #d5d5d5; }
.search-form { overflow: visible; }

.stepflow .cell-label { font-weight: bold; padding-right: 10px; }
.stepflow .cell-field.Label { color: black !important; }
.stepflow .cell-field { padding: 5px 8px; }
.stepflow.layout2 .section > .h { background: #2588CB; color: white; text-transform: uppercase; font-size: 16px; }
.stepflow.layout2 .section:not(.no-title) > .c > .form-table > tbody > tr > td { border-top: none; }

.CellectSearch .generating > h2 { text-align: center; font-size: 28px; color: #333; margin: 0; }
.CellectSearch .generating > .loading { text-align: center; margin-bottom: 20px; }

.CellectOrderProfile .chk-w { display: flex; margin: 50px 0; }
    .CellectOrderProfile .chk-w > .chk { width: 145px; text-align: center; position: relative; margin: 0 1px; }
        .CellectOrderProfile .chk-w > .chk > .circle { width: 56px; height: 56px; border: solid 5px #D1D6DE; border-radius: 100px; margin: 0 auto 25px; }
        .CellectOrderProfile .chk-w > .chk > .name { font-size: 14px; margin: 0 auto; font-weight: 600; color: #8590A0; height: 60px; }
        .CellectOrderProfile .chk-w > .chk > .box { margin: 0; height: 120px; background: #CFE8F7; font-size: 14px; padding: 20px 14px; color: #2E6180; }
        .CellectOrderProfile .chk-w > .chk:not(:first-child):before { content: ''; border-top: dashed 4px #D1D6DE; position: absolute; width: 92px; top: 27px; left: -46px; }
        .CellectOrderProfile .chk-w > .chk.active:not(:first-child):before { border-top: solid 4px #33B5E5; }
        .CellectOrderProfile .chk-w > .chk > .name { width: 110px; }
        .CellectOrderProfile .chk-w > .chk:nth-child(6) > .name { width: 120px; }
        .CellectOrderProfile .chk-w > .chk:nth-child(5) > .name { width: 90px; }
        .CellectOrderProfile .chk-w > .chk.active { }
            .CellectOrderProfile .chk-w > .chk.active > .circle { background: #33B5E5; border-color: #33B5E5; font-family: FontAwesome; display: flex; align-items: center; justify-content: center; color: white; font-size: 30px; }
                .CellectOrderProfile .chk-w > .chk.active > .circle:before { content: "\f00c"; }
            .CellectOrderProfile .chk-w > .chk.active > .name { font-weight: bold; color: #2E6180; }

.CellectDonorList .criteria-row > td { position: sticky; top: -31px; }
.CellectDonorList .criteria-row > .cell-field { background: white; }

x-field { flex: 1; height: 50px; border: solid 1px #66A4CE; border-radius: 10px; background: white; position: relative; overflow: hidden; display: block; box-sizing: border-box; }
    x-field > label { color: #a0aebc; font-weight: 600; text-align: left; font-size: 12px; display: block; padding: 6px 10px 2px; transform: scale(1.3) translateY(6px); transform-origin: top left; transition: transform .3s; position: absolute; }
        x-field > label > x-req { transition: opacity .3s; }
    x-field > input, x-field > select { width: 100%; border: none; font-size: 16px; color: #405D79; font-weight: 600; padding: 0 20px; outline: none; background: none; height: 100%; padding-top: 16px; position: relative; box-sizing: border-box; }
        x-field > input:autofill, x-field > select:autofill { margin-top: 24px; padding-top: 0; height: calc(100% - 24px); }
        x-field > input[disabled] { color: #a0aebc; }
    x-field.sm-lbl > label, x-field:has(input:autofill) > label { transform: none; }
        x-field.sm-lbl > label > x-req { opacity: 0; }

#login-body { font-family: sans-serif; }
    #login-body #form-w { text-align: center; padding: 50px 10px 95px; }
        #login-body #form-w > h2 { color: #405D79; font-size: 36px; margin: 74px 20px 34px; }

    #login-body #form { border: solid 1px #93BAD6; max-width: 700px; margin: 0 auto; border-radius: 20px; padding: 50px 25px; background: linear-gradient(#fff,#E4F3F9); }
        #login-body #form > .c { max-width: 462px; margin: 0 auto; }

    #login-body #email-w { margin-bottom: 30px; }

    #login-body #forgot-pwd-w { text-align: right; margin-top: 12px; }
    #login-body #forgot-pwd { text-decoration: underline; color: #0069AE; }

    #login-body #login-btn-w { margin-top: 30px; margin-bottom: 20px; border-bottom: solid 1px #93BAD6; padding-bottom: 30px; }
    #login-body #login-btn { background: #F15825; border: none; color: white; font-size: 20px; font-weight: bold; border-radius: 10px; padding: 14px 90px; box-shadow: 0 3px 6px #aaa; }

    #login-body #or-sign-in { color: #57728A; }
    #login-body #register-w { margin-top: 30px; }
    #login-body #register { text-decoration: underline; color: #0268AD; }

    #login-body #socials { display: flex; justify-content: center; margin-top: 20px; align-items: center; }
        #login-body #socials > img, #socials > a { margin: 0 10px; cursor: pointer; }
            #login-body #socials > img:hover { opacity: .8; }
    #login-body #google-signin { height: 76px; }
    #login-body #linkedin-signin { height: 72px; }
    #login-body #err-msg { color: red; margin-bottom: 20px; }
    #login-body #msg-w { text-align: center; padding: 80px 20px 300px; font-size: 20px; }

    /*sms-code*/
    #login-body #form > .c > x-intro { font-size: 24px; display: block; margin-bottom: 30px; }
    #login-body #code { margin: 40px -60px; display: flex; justify-content: center; }
        #login-body #code > input { width: 75px; height: 85px; border: solid 1px #99C3DE; border-radius: 6px; margin: 0 10px; text-align: center; font-size: 36px; font-weight: bold; }
    #login-body #cont-btn-w { margin-bottom: 20px; }
    #login-body #resend-code { text-decoration: underline; color: #0069AE; }
    #login-body #didnt-receive-w { border-bottom: solid 1px #93BAD6; padding-bottom: 40px; margin-bottom: 40px; }
    #login-body #back-to-login > a { color: #0069AE; }

    #login-body #form.set-password > .c > x-intro { text-align: left; font-size: 16px; }
    #login-body #form.set-password #password-w { margin-bottom: 20px; }

@media(max-width:1023px) {
    #login-body #code > input { width: 30px; margin: 0 5px; height: 35px; font-size: 22px; }
}

@media(max-width:767px) {
    #login-body #form-w > h2 { font-size: 26px; margin: 30px 20px 20px; }
    #login-body #login-btn { padding: 10px 40px; font-size: 16px; }
}