﻿body {
    font-family: 'Quicksand', Arial, Arial, Helvetica, sans-serif;
    overflow: hidden;
}


h3 {
    text-align: center;
}

h4 {
    text-align: center;
}

h5 {
    text-align: center;
}
/* temp */
.assessorBox {
    float: left;
    width: 100%;
}
.claimTotal {
    position: fixed;
    bottom: 127px;
    background: #D00;
    width: 200px;
    left: calc(20vw + 19px);
    height: 35px;
    border: 1px solid #FCC;
    color: #FFF;
    font-weight: 700;
    padding: 10px;
    font-size: 24px;
}
.sessionExamBox {
    margin: 10px;
    vertical-align: middle;
    width: 30%;
    min-height: 120px;
    height: fit-content;
    border: 1px solid #D00;
    border-radius: 15px;
    display: inline-block;
}

.sessionExamBoxHeader {
    margin: auto;
    font-weight: 500;
    font-size: 20px;
}

.time-picker {
    padding: 10px;
}

.timeInput {
    padding: 10px;
    margin: 10px;
}

.examSubBox {
    display: inline-block;
    padding: 10px;
    border-bottom: 1px solid #ccc;
    margin-top: -10px;
    width: 95%;
}

.examSubHeader {
    display: inline-block;
    float: left;
    font-size: 18px;
}

.qualSubHeader {
    margin: auto;
    margin-top: -10px;
    display: inline-block;
    float: left;
    font-size: 14px;
}

.qualSubBox {
    margin: auto;
}

.noExamSubBox {
    width: 100%;
}

.noExamSubHeader {
    width: 100%;
}

.bookingPageBreak {
    width: 90%;
    margin: auto;
    height: 0px;
    border: 1px solid #D00;
}


.qualificationPopUp {
    display: none;
    transform: translateX(250%);
    z-index: 999;
    height: 800px;
    width: 600px;
    border: 1px solid #3762f6;
    border-radius: 15px;
    background: #FFF;
    position: sticky;
    top: 0;
    left: 25vw;
}

.qualificationPopUpCloseOption {
    float: right;
    padding: 10px;
}


.assessorHub {
    display: none;
}

.personalCalendarWindow {
    width: 90%;
    height: 800px;
    margin: auto;
    border: 1px solid #3762f6;
    border-radius: 15px;
    padding: 1px;
}


.hubSessionInteriorBox {
    float: left;
    padding: 30px;
    margin: 30px;
    border-radius: 10px;
    border: 1px solid #CCC;
    font-size: 24px;
}

.sessionTotalBox {
    float: left;
    display: block;
    width: 100%;
    margin: 30px;
    font-weight: 600;
    font-size: 24px;
}

.sessionTotalCostBox {
    float: left;
    width: 100%;
    font-size: 24px;
    font-weight: 600;
    margin: 30px;
}

.organiserHub {
    display: none;
}

.itSupportPage {
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    transform: translateX(250%);
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
}

.supportTitle {
    margin: auto;
    padding: 10px;
    font-weight: 500;
}

    .supportTitle h2 {
        margin: auto;
        padding: 10px;
        font-weight: 400;
    }

.itSupportBox {
    padding: 10px;
    height: 30vh;
    width: 40vw;
    font-size: 15px;
}

.itSupportContent {
    padding: 10px;
    border: 1px solid #CCC;
    margin: 10px auto;
    width: 95%;
    height: 65%;
    background: #fff;
}

.itSupportLabel {
    margin: 10px auto;
}

.messageContainer {
    width: 60%;
    margin: auto;
}

    .messageContainer input {
        width: 100%;
        height: 250px;
    }

.personalInfoPage {
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    overflow-y: auto;
    height: calc(100% - 110px);
    background: #f8f8f8;
    transform: translateX(250%);
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
}

.personalPage {
    padding: 10px;
    border: 1px solid #CCC;
    margin: 10px auto;
    width: 95%;
    background: #fff;
}

    .personalPage h2 {
        font-size: 22px;
        font-weight: 450;
        float: left;
    }

    .personalPage h3 {
        font-size: 16px;
        font-weight: 350;
        float: left;
    }

.personalContent {
    border-top: 1px solid #ccc;
    width: 100%;
    margin: 100px auto;
}

    .personalContent h2 {
        font-size: 22px;
        font-weight: 450;
        float: left;
        display: block;
    }

    .personalContent h3 {
        font-size: 16px;
        font-weight: 350;
        display: block;
        float: left;
        margin: -10px 0 0 20px;
    }

    .personalContent br {
        line-height: 150%;
    }

.centreSubHeading {
    font-size: 16px;
    font-weight: 350;
    display: block;
    float: left;
    margin: -10px 0 0 20px;
}

.centreDetailsContent {
    border-top: 1px solid #ccc;
    width: 100%;
    margin: 50px auto;
}

.calendarHubPage {
    transform: translateX(0%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    position: absolute;
    left: 0px;
    text-align: center;
}

.expensePage {
    transform: translateX(250%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    position: absolute;
    left: 0px;
    text-align: center;
}

.crfPage {
    transform: translateX(250%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    position: absolute;
    left: 0px;
    top: 0px;
    text-align: center;
}


.expenseCategory {
    margin: 10px auto;
    border: 1px solid #ccc;
    width: 95%;
    padding: 10px;
    background: #fff;
    text-align: center;
}

.expenseCategoryButton {
    width: 30%;
    background: none;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 500;
    padding: 10px;
}

    .expenseCategoryButton:hover {
        color: #004896;
    }

    .expenseCategoryButton:active {
        background-color: rgba(0,72,150,.08);
    }


.reportCategory {
    margin: 10px auto;
    border: 1px solid #ccc;
    width: 95%;
    padding: 10px;
    background: #fff;
    text-align: center;
}

.reportCategoryButton {
    width: 30%;
    background: none;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 500;
    padding: 10px;
}

    .reportCategoryButton:hover {
        color: #004896;
    }

    .reportCategoryButton:active {
        background-color: rgba(0,72,150,.08);
    }

.expenseContent {
}

.reviewList {
    list-style: none;
}

.organiserCalendarWindow {
    height: 600px;
    width: 600px;
    border: 1px solid #3762f6;
    border-radius: 15px;
}

.hubSortButton{
    float:right;
    padding:10px;
    border:0;
    background:#33F;
    color:#FFF;
    font-size:16px;
    margin:-8px;
}

.expenseSessionLabel {
    background:#D00;
    color:#FFF;
    padding:10px;
    font-size:18px;
    font-weight:600;
    position: absolute;
    top: 0;
    left: 0;
}
.expenseFormItem {
    width: 90%;
    float: right;
    border-bottom: 1px solid #D00;
    padding: 5px;
    height: 380px;
    position:relative;
}

.expenseFormItemLabel {
    float: right;
    padding: 5px;
    height: 60px;
    width: 60%;
}

.expenseFormItemInput {
    float: right;
    width: 60%;
    padding: 10px;
}

.candidateRegisterPage {
    transform: translateX(250%);
    position: absolute;
    top: -50px;
    background: #F2F2F2;
    color: #000;
    width: calc(100% - 80px);
    height: 100%;
    transition: 0.3s;
    text-align: center;
    font-size: 12px;
    border-color: #F2F2F2;
    border-style: solid;
    border-width: 40px 40px 500px 40px;
    color: #666;
    line-height: 30px;
}

.role-permission-title {
    font-size: 18px;
    padding: 10px 0;
    font-weight: 600;
}

.reportPage {
    transform: translateX(250%);
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
}

.role-permission-content {
    overflow-y: auto;
    height: 300px;
    border-bottom: 1px solid #D00;
    padding: 10px;
    background: #EEE;
    font-size: 14px;
}

.hubselectedDay {
    background-color: greenyellow;
}

#crfTable {
    overflow-y: auto;
    height: 80%;
    text-align: center;
}

.crfInput {
    padding: 10px;
    margin: 10px;
    float: left;
    width: calc(60% - 40px);
}

.crfQuestion {
    width: 100%;
    float: left;
    margin-bottom: 20px;
    display: block;
}

.crfLabel {
    float: left;
    width: calc(60% - 60px);
    font-weight: 600;
    margin-left: 20px;
    text-align: center;
}

.crfHeader {
    width: 100%;
    float: left;
    display: block;
}

.crfButton {
    float: left;
    background: #D00;
    color: #FFF;
    font-size: 18px;
    padding: 10px 20px;
    border: 0;
    margin: 10px;
    float: right;
}

.crfSectionQuestion {
    width: calc(100% - 50px);
    float: left;
    display: block;
    border-bottom: 1px solid #D00;
    padding: 20px;
}

.crfSection {
    width: calc(100% - 50px);
    float: left;
    display: block;
    border-bottom: 1px solid #D00;
    padding: 20px;
}


.candidateRegisterIcon {
    margin-top: 190px;
    margin-bottom: -30px;
}

.candidateRegisterHeader {
    font-size: 22px;
    font-weight: 400;
    padding: 40px 30px;
    text-align: left;
}

.candidateRegisterButton {
    background: #3762f6;
    color: #FFF;
    margin: 30px 0;
    padding: 15px 30px;
    font-weight: 600;
    border-radius: 10px;
    font-size: 14px;
    box-shadow: #CCC 6px 10px 15px;
    border: 0;
}

.candidateRegisterLink {
    background: transparent;
    border: 0;
}

    .candidateRegisterLink:hover {
        text-decoration: underline;
    }

.hubButton {
    display: inline-block;
    height: 50px;
    width: 20%;
    max-width: 250px;
    background: #3762f6;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
    margin: 20px;
}

.hubButtonAlt {
    display: inline-block;
    height: 50px;
    width: 20%;
    max-width: 250px;
    margin: 20px;
    background: #FFF;
    border: 1px #3762f6 solid;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #3762f6;
}
/* -----*/
.newForm {
    position: absolute;
    top: 200px;
    left: 0;
    width: 100vw;
    z-index: 100;
    display: block;
    height: 100vh;
    background: white;
}

.newInputHolder {
    width: 50%;
    float: left;
    display: block;
    height: 100px;
    border-bottom: 1px solid red;
}

.logo {
    height: 60px;
}

.logoInner {
    height: calc(100% - 20px);
    display: block;
    margin: 10px 20px;
    float: left;
}

.newButton {
    background: #D00;
    color: #FFF;
    border: 0;
    border-radius: 10px;
    height: 30px;
    width: 30px;
    position: absolute;
    top: 250px;
    left: 480px;
}

.newInputHeader {
    font-size: 16px;
    color: #000;
    text-transform: capitalize;
    padding: 10px 10px 0 10px;
    float: left;
}

.newInput {
    margin: 10px;
    width: calc(100% - 40px);
    padding: 10px;
}

.newFormBlock {
    width: 80%;
    position: relative;
    float: left;
    border-left: 1px solid red;
    margin: 20px;
}

.disabled {
    background: #CCC !important;
    color: #AAA !important;
}

.disabledIcon {
    background-color: #CCC !important;
    border-color: #CCC !important;
    filter: grayscale(1);
}

.content {
    width: 100vw;
    height: calc(100vh - 40px);
    overflow-x: hidden;
    background: white;
    position: absolute;
    filter: blur(10px);
    top: 60px;
    left: 0;
    padding: 0;
    overflow-y: scroll;
    margin: 0;
}

.notice {
    text-align: center;
    padding: 20px 0;
    color: #F00;
    font-weight: 900;
    font-size: 30px;
}

.candidateFormContainer {
    font-family: Arial, sans-serif;
}

.tabContainer {
    display: flex;
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc;
}

.tabButton {
    background: none;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 16px;
}

    .tabButton.active {
        border-bottom: 3px solid #3762f6;
        color: #3762f6;
        font-weight: bold;
    }

.candidateFormRows {
    margin-bottom: 20px;
}

.candidateFormRow {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

    .candidateFormRow > div {
        flex: 1;
    }

    .candidateFormRow.header {
        font-weight: bold;
    }

    .candidateFormRow input, .candidateFormRow select {
        width: 100%;
        padding: 8px;
        box-sizing: border-box;
    }

.addCandidateButton, .submitButton, .cancelButton, .downloadTemplateButton, .uploadCsvButton {
    padding: 8px 16px;
    border-radius: 4px;
    cursor: pointer;
}

.addCandidateButton {
    background: none;
    border: 1px solid #3762f6;
    color: #3762f6;
    margin-bottom: 20px;
}

.submitButton {
    background: #3762f6;
    color: white;
    border: none;
}

    .submitButton:disabled {
        background: #ccc;
        color: #999;
        cursor: not-allowed;
    }

.cancelButton {
    background: none;
    border: 1px solid #ccc;
    margin-right: 10px;
}

.formActions {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.selectedCandidates {
    border-top: 1px solid #eee;
    padding-top: 20px;
    margin-top: 20px;
}

.registerCandidateItem {
    display: flex;
    align-items: center;
    padding: 8px;
    border-bottom: 1px solid #eee;
}

    .registerCandidateItem input[type="checkbox"] {
        margin-right: 10px;
    }

.selectedCandidateItem {
    background: #f5f5f5;
    padding: 8px;
    margin-bottom: 5px;
    display: flex;
    justify-content: space-between;
}

.removeCandidate {
    background: none;
    border: none;
    color: red;
    cursor: pointer;
}

.existingCandidatesSection {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.existingCandidatesList {
    max-height: 200px;
    overflow-y: auto;
}

.existingCandidateItem {
    background: #f0f7ff;
    padding: 8px;
    margin-bottom: 5px;
    display: flex;
    justify-content: space-between;
    border-left: 3px solid #3762f6;
}

.candidateActionButtons {
    display: flex;
    gap: 10px;
}

.deleteCandidate, .moveCandidate {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 16px;
}

.deleteCandidate {
    color: red;
}

.moveCandidate {
    color: #3762f6;
}

.examLabel {
    font-size: 14px;
    color: #666;
    margin-top: 5px;
}

.csvImportActions {
    display: flex;
    gap: 10px;
}

.downloadTemplateButton, .uploadCsvButton {
    background: none;
    border: 1px solid #3762f6;
    color: #3762f6;
}

.csvPreviewContainer {
    border: 1px solid #eee;
    padding: 10px;
    border-radius: 4px;
    max-height: 300px;
    overflow-y: auto;
}

.csvPreviewTable {
    width: 100%;
    border-collapse: collapse;
}

    .csvPreviewTable th, .csvPreviewTable td {
        border: 1px solid #ddd;
        padding: 8px;
        text-align: left;
    }

    .csvPreviewTable th {
        background-color: #f2f2f2;
    }

.candidateInfoContainer {
    flex: 1;
}

.deleteCandidateConfirmDialog {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    z-index: 1000;
}

    .deleteCandidateConfirmDialog .buttonContainer {
        display: flex;
        justify-content: flex-end;
        gap: 10px;
        margin-top: 20px;
    }

    .deleteCandidateConfirmDialog button {
        padding: 8px 16px;
        border-radius: 4px;
        cursor: pointer;
    }

    .deleteCandidateConfirmDialog .cancelBtn {
        background: none;
        border: 1px solid #ccc;
    }

    .deleteCandidateConfirmDialog .confirmBtn {
        background: #ff3b30;
        color: white;
        border: none;
    }

.candidateLimitWarning {
    background: #fff3cd;
    border: 1px solid #ffeaa7;
    border-radius: 4px;
    padding: 12px;
    margin-bottom: 15px;
}

    .candidateLimitWarning .warningMessage {
        color: #856404;
        font-weight: bold;
    }

.examLimitExceeded {
    color: #d63384;
    font-weight: bold;
}

.moveCandidate {
    background: #D00;
    color: #FFF;
    padding: 10px;
    border-radius: 5px;
    float: right;
}

.moveCandidateDialog {
    max-width: 600px;
    width: 90%;
}

.examItem {
    transition: background-color 0.2s;
}

.sessionHeader {
    margin-top: 10px;
}

.shortcutButton {
    background-color: #FFF;
    width: 4vw;
    min-width: 60px;
    position: fixed;
    background-position: center 1vw;
    z-index: 11;
    border-style: solid;
    border-color: #F33;
    border-width: 1px 0 0 1px;
    /*box-shadow: 5px 5px 8px rgba(0,0,0,0.35);*/
    min-height: 60px;
    height: 4vw;
    background-size: 50%;
    background-repeat: no-repeat;
    transition: 0.3s;
    bottom: 0px;
}

.greyMarker {
    filter: grayscale(1) brightness(2);
}

.jiggly {
    animation: jiggle 0.5s 1;
    filter: drop-shadow(0 0 5px #F00) brightness(1) grayscale(0) !important;
}

@keyframes jiggle {
    0% {
        margin-top: 0px
    }

    50% {
        margin-top: -10px;
    }

    100% {
        margin-top: 0px;
    }
}

.expandButton {
    position: absolute;
    z-index: 10;
    top: 45%;
    right: -20px;
    background: #F00;
    border: 0;
    width: 40px;
    transition: 0.3s;
    height: 40px;
    transform: rotate(45deg);
}

    .expandButton div:first-child {
        position: absolute;
        background: #FFF;
        height: 3px;
        transition: 0.3s;
        width: 13px;
        top: 23px;
        left: 5px;
        display: block;
    }

    .expandButton div:last-child {
        position: absolute;
        background: #FFF;
        height: 13px;
        transition: 0.3s;
        width: 3px;
        top: 23px;
        left: 15px;
        content: '';
        display: block;
    }

.bookingFilterControls {
    background: #F00;
    color: #FFF;
    transition: 0.3s;
    height: 0px;
    overflow: hidden;
    margin-top: 15px;
    font-size: 16px;
}

.bookingStatus {
    font-weight: 900;
}

.filterRow {
    width: calc(25% - 40px);
    float: left;
    display: block;
    padding: 10px;
}

.standardFilterInput {
    padding: 10px;
    width: calc(100% - 35px);
    border: 0;
    margin: 5px 0;
    float: left;
}

.standardHubButton {
    background: #55F;
    color: #FFF;
    float: right;
    padding: 15px 30px;
    border: 0;
    border-radius: 10px;
    margin: 10px;
    font-weight: 600;
    font-size: 20px;
}

.standardFilterButton {
    background: #FFF;
    border: 0;
    margin: 36px 5px;
    padding: 10px;
    display: block;
}

.hubBookingRow {
    float: left;
    display: block;
    border: 1px solid #CCC;
    width: calc(100% - 2px);
    min-height: 280px;
    border-radius: 5px;
    margin: 20px 0;
}

.hubBookingRowHeader {
    font-size: 14px;
    color: #666;
    margin: 5px 20px;
}

.hubSessionRow {
    float: left;
    display: block;
    width: 80%;
    font-weight: 600;
    font-size: 20px;
    margin: 5px 20px;
}

.hubExamRow {
    font-size: 16px;
    font-weight: 400;
    margin: 10px 0;
    color: #666;
}

.quickFilterInput {
    border: 1px solid red;
    border-radius: 20px;
    margin: 5px;
    font-size: 18px;
    padding: 5px 10px;
    position: absolute;
    top: -5px;
    left: 20px;
    width: calc(100% - 90px);
}

.mailRecipients {
    width: calc(100% - 40px);
    margin: 10px 10px 0px 10px;
    height: 30px;
    background: #F33;
    color: #FFF;
    font-weight: 900;
    padding: 10px;
    float: left;
    border-radius: 10px;
}

.mailWindow {
    width: calc(100% - 20px);
    margin: 10px;
    height: calc(100% - 140px);
    background: #FFF;
    float: left;
    border-radius: 10px;
}

.messageBox {
    float: right;
    padding: 10px;
    background: #FCC;
    margin: 10px;
    width: 60%;
    position: relative;
    text-align: right;
    border-radius: 10px;
}

    .messageBox::after {
        content: '';
        display: block;
        border-style: solid;
        border-width: 15px 0 0 20px;
        border-color: #FCC transparent;
        position: absolute;
        top: 40px;
        right: 20px;
    }

.mailInput {
    padding: 10px;
    margin: 0 5px 5px 10px;
    border: 0;
    font-size: 16px;
    height: 30px;
    border-radius: 10px;
    width: calc(80% - 40px);
}

.sendButton {
    background: #FFF;
    border-radius: 10px;
    border: 0;
    font-size: 18px;
    height: 50px;
    width: calc(20% - 10px);
}

.mailWidget {
    width: 500px;
    height: 0px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 10px 10px 8px rgba(0,0,0,0.35);
    position: absolute;
    background: #F99;
    top: -3px;
    transition: 0.3s;
    right: -520px;
}

.mapWidget {
    width: 500px;
    height: 0px;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 10px 10px 8px rgba(0,0,0,0.35);
    position: absolute;
    background: #E00;
    top: -3px;
    transition: 0.3s;
    right: -520px;
}

#sessionMap {
    border: 1px solid #F00;
    width: 100% !important;
    float: left !important;
    height: 273px;
    display: block;
}

.mapWindow {
    width: 494px;
    float: left;
    height: 440px;
    background: #FFF;
    margin: 3px 3px 0 3px;
}

.mapAddress {
    color: #000;
    float: left;
    width: 474px;
    margin: 0 3px;
    background: #FFF;
    text-align: left;
    font-weight: 600;
    padding: 10px;
    height: 77px;
    overflow-y: auto;
    border-radius: 0 0 10px 10px;
    font-size: 18px;
}

    .mapAddress::-webkit-scrollbar {
        display: none;
    }

.olControlZoomIn {
    background: #F00;
    color: #FFF;
    text-decoration: none;
    width: 40px;
    height: 40px;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 24px;
    text-align: center;
    font-weight: 700;
    display: block;
    border-radius: 0 0 15px 0;
}

.olControlZoomOut {
    background: #F00;
    color: #FFF;
    text-decoration: none;
    width: 40px;
    position: absolute;
    top: 0;
    left: 561px;
    height: 40px;
    font-size: 24px;
    text-align: center;
    font-weight: 700;
    display: block;
    border-radius: 0 0 0 15px;
}

.shortcutButton:hover::before {
    border-bottom-color: #F66;
}

.shortcutButton:hover::after {
    border-left-color: #F66;
}

.shortcutButton:hover {
    background-color: #F66;
}

.settingsIcon {
    right: 1vw;
    bottom: 9vw;
    padding-bottom: 7vw;
    background-image: url("../assets/settingsIcon.png");
}

.historyIcon {
    right: 1vw;
    bottom: 4vw;
    padding-bottom: 8vw;
    background-image: url("../assets/historyIcon.png");
}

.calendarIcon {
    right: 1vw;
    bottom: 1vw;
    padding-bottom: 7vw;
    background-image: url("../assets/calendarIcon.png");
}

.directoryIcon {
    right: 1vw;
    bottom: 0vw;
    background-image: url("../assets/directoryIcon.png");
}

.header {
    width: 100vw;
    height: 60px;
    transition: 1s;
    background: #FFF;
    position: absolute;
    top: -500px;
    left: 0;
    z-index: 3;
    border-bottom: 2px solid #D00;
}

.menu {
    float: left;
    display: block;
    position: absolute;
    bottom: -10px;
    left: 150px;
    height: 45px;
}

.qualificationRecord {
    background: #FFF;
    float: left;
    display: block;
    width: 100%;
}

.disabledMenuItem {
    text-decoration: line-through;
    display: block;
    float: left;
    font-weight: 650;
    padding: 2px 15px;
    border: 1px solid transparent;
    transition: 0.3s;
    position: relative;
    margin: 0px 0px;
    height: 24px;
    font-size: 20px;
    color: #999;
    text-align: center;
}

.standardMenuItem {
    display: block;
    float: left;
    font-weight: 650;
    padding: 2px 15px;
    border: 1px solid transparent;
    transition: 0.3s;
    position: relative;
    margin: 0px 0px;
    height: 24px;
    font-size: 20px;
    color: #999;
    text-align: center;
}

.helpButton {
    background: #F66;
    color: #FFF;
    border: 0;
    width: 20px;
    text-align: center;
    font-size: 12px;
    height: 20px;
    float: left;
    margin: 10px;
    border-radius: 999px;
}

.tooltip {
    position: absolute;
    padding: 10px;
    background: rgba(255,255,255,0.9);
    z-index: 12;
    width: 200px;
    font-size: 14px;
    border: 1px solid #FCC;
    transition: 0.3s;
    border-radius: 8px;
    top: calc(100vh + 200px);
    left: 0;
}

.activeMenuItem {
    display: block;
    float: left;
    font-weight: 650;
    padding: 2px 15px;
    border: 1px solid transparent;
    transition: 0.3s;
    position: relative;
    margin: 0px 0px;
    height: 24px;
    font-size: 25px;
    color: #D00;
    text-align: center;
}

.standardMenuItem:hover {
    display: block;
    float: left;
    font-weight: 650;
    padding: 2px 15px;
    border: 1px solid transparent;
    transition: 0.3s;
    position: relative;
    margin: 0px 0px;
    height: 24px;
    font-size: 25px;
    color: #999;
    text-align: center;
}

.standardMenuItem:active {
    background: #FFF;
    color: #F00;
}

#candidateTable {
    width: calc(65vw + 40px);
    display: block;
    margin: 50px 0;
}

.candidateHeader,
.candidateRow {
    display: grid;
    grid-template-columns: repeat(12, minmax(100px, 1fr));
    gap: 0.5rem;
    align-items: center;
    padding: 25px 0 5px 0;
}

.candidateHeader {
    font-weight: bold;
    border-bottom: 3px solid #D00;
}

.removeCandidate {
    background: #F00;
    color: #FFF;
    border: 0;
    padding: 10px;
    float: right;
    width: 50%;
}

.candidateRow {
    border-bottom: 1px solid #ccc;
}

    .candidateRow input,
    .candidateRow select {
        width: 100%;
        padding: 10px;
        border-width: 0 0 1px 0;
        border-color: #D00;
        border-style: solid;
        box-sizing: border-box;
    }

.inputButton {
    margin-top: 1rem;
    padding: 0.5rem 1rem;
}

.examButtonDisabled {
    width: 100%;
    padding: 20px 30px 20px 0;
    text-align: right;
    font-size: 18px;
    border-width: 0 0 1px 0;
    border-style: solid;
    color: #777;
    border-color: #999;
    background-color: #CCC;
    background-image: url("../assets/unavailable.png");
    background-size: auto 50%;
    background-repeat: no-repeat;
    background-position: 5% 50%;
}

.examButton {
    width: 100%;
    padding: 10px 80px 10px 0;
    text-align: right;
    font-size: 1em;
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: #CCC;
    background-color: #FFF;
    background-image: url("../assets/inviteIcon.png");
    background-size: auto 50%;
    background-repeat: no-repeat;
    background-position: 5% 50%;
}

.dataGridRow:hover {
    background: #FCC;
}

.examButton:hover {
    background-color: #FCC;
}

.search {
    float: right;
    border: 0;
    height: 60px;
    width: 20vw;
    position: absolute;
    top: 5px;
    right: 0;
}

.searchInput {
    padding: 10px;
    border: 5px solid #FFF;
    border-color: #FFF;
    border-style: solid;
    border-width: 5px 30px 5px 5px;
    background: #EAEAEA;
    width: 200px;
    margin: 5px 20px 0 0;
    border: 2px solid #CCC;
    height: 16px;
    float: right;
    border-radius: 25px;
}


.searchButton {
    background-color: #D00;
    background: #D00;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border: 0px;
    float: left;
    color: #B00;
    font-weight: 900;
    width: 50px;
    height: 40px;
    margin-left: -10px;
    margin: 5px 0 0 -20px;
    position: absolute;
    right: 10px;
}

    .searchButton::before {
        content: '';
        width: 4.5px;
        height: 15px;
        transform: rotate(-45deg);
        background: #Fff;
        display: block;
        position: absolute;
        top: 20px;
        left: 23px;
    }

    .searchButton::after {
        content: '';
        width: 12px;
        height: 12px;
        border: 4px solid #Fff;
        display: block;
        background: #D00;
        border-radius: 999px;
        position: absolute;
        top: 8px;
        left: 8px;
    }

.column {
    float: left;
    padding: 20px;
    height: calc(100vh - 130px);
    overflow-y: auto;
    font-size: 20px;
    transition: 0.3s;
    top: 10px;
    z-index: 5;
    position: absolute;
}

    .column::-webkit-scrollbar {
        display: none;
    }

.pageControls {
    float: left;
    width: calc(100% - 40px);
    height: 40px;
    padding: 10px 10px 0 10px;
}

.pageControlButton {
    height: 50px;
    width: 50px;
    float: left;
    border: 0;
    background: #FFF;
    border: 1px solid #D00;
    position: relative;
}

    .pageControlButton::before {
        display: block;
        content: '';
        background: #D00;
        width: 17px;
        height: 2px;
        transform: rotate(135deg);
        position: absolute;
        top: 17px;
    }

    .pageControlButton::after {
        display: block;
        content: '';
        background: #D00;
        width: 17px;
        height: 2px;
        transform: rotate(45deg);
        position: absolute;
        top: 29px;
    }

/*Change*/
.columnInner {
    width: calc(100% - 20px);
    margin-top: 20px;
    height: calc(100vh - 220px);
    overflow-y: scroll;
    float: left;
}

    .columnInner::-webkit-scrollbar {
        display: none;
    }
/*Change*/
.columnLeft {
    left: 0;
    z-index: 6;
    width: calc(30vw - 15.3%);
    min-width: 200px;
    border-right: 1px solid #CCC;
    margin-top: 10px;
    overflow-x: hidden;
}
/*Change*/
.columnMiddle {
    left: calc(15vw - 10px);
    margin-left: 1.5vw;
    transition: 0.3s;
    overflow-X: hidden;
    max-height: calc(100vh - 100px);
    width: calc(70vw - 80px);
    padding-top: 0px;
    top: 50px;
}

.table {
    height: 100%;
    width: 100%;
}

.centrePageControls {
    margin: 30px 20px;
}

.pageTable {
    width: 90vw;
    margin: 30px;
    height: 75vh;
    border: 1px solid #F33;
}
/*Change*/
.columnRight {
    left: 83vw;
    margin-left: 1vw;
    transition: 0.3s;
    overflow: hidden;
    max-height: calc(100vh - 200px);
    width: calc(20vw - 100px);
}

.falseIcon {
    border-radius: 999px;
    width: 30px;
    height: 30px;
    float: right;
    position: relative;
    margin-right: 30px;
    background: #F00;
}

    .falseIcon::before {
        content: '';
        display: block;
        width: 3px;
        height: 15px;
        background: #FFF;
        position: absolute;
        transform: rotate(45deg);
        left: 13px;
        top: 8px;
    }

    .falseIcon::after {
        content: '';
        display: block;
        width: 3px;
        height: 15px;
        background: #FFF;
        position: absolute;
        transform: rotate(135deg);
        left: 13px;
        top: 8px;
    }

.listItemPrimary {
    font-size: 20px;
    z-index: 5;
    position: relative;
    overflow: hidden;
    float: left;
    width: calc(100% - 20px);
    padding: 10px;
    font-weight: 500;
    background: #FFF;
    border-bottom: 1px solid #CCC;
}

    .listItemPrimary:hover {
        background: #FCC;
        color: #000;
    }

.bookingListCentreName {
    font-size: 16px;
    font-weight: 500;
    float: left;
    margin-top: -2px;
    margin-bottom: -8px;
}

.columnBreak {
    width: 100%;
    height: 2px;
    background: #CCC;
    margin: 20px 0;
    float: left;
    display: block;
}

.listItemSecondary {
    font-size: 18px;
    width: 80%;
    position: relative;
    z-index: 4;
    float: right;
    position: relative;
    padding: 10px;
    transition: 0.3s;
}

    .listItemSecondary::before {
        display: block;
        z-index: 4;
        content: " ";
        left: -25px;
        top: 5px;
        position: absolute;
        width: 2px;
        height: 100%;
        background: #999;
    }

    .listItemSecondary::after {
        display: block;
        z-index: 4;
        content: " ";
        left: -25px;
        top: 20px;
        position: absolute;
        width: 30px;
        height: 2px;
        background: #999;
    }


.listItemTertiary {
    font-size: 18px;
    width: 80%;
    float: right;
    padding: 10px;
    position: relative;
    transition: 0.3s;
}

    .listItemTertiary::before {
        width: 30px;
        height: 35px;
        display: block;
        z-index: 4;
        content: " ";
        left: -15px;
        top: 5px;
        position: absolute;
        width: 2px;
        height: 120%;
        background: #999;
    }

    .listItemTertiary::after {
        width: 30px;
        height: 40px;
        display: block;
        z-index: 4;
        content: " ";
        left: -13px;
        top: 20px;
        position: absolute;
        width: 20px;
        height: 2px;
        background: #999;
    }

.listItemChildren {
    overflow-y: auto;
    height: 0;
    width: 100%;
    transition: 0.3s;
}

    .listItemChildren::-webkit-scrollbar {
        display: none;
    }

.listItemSecondaryChildren {
    width: 100%;
    float: right;
    overflow-y: auto;
    height: 0;
    transition: 0.3s;
}

    .listItemSecondaryChildren::-webkit-scrollbar {
        display: none;
    }

.tableHeader {
    width: 100%;
    border-bottom: 1px solid #999;
    font-weight: 600;
    float: left;
    font-size: 18px;
}

.cell {
    float: left;
    padding: 10px;
}

.tenWidth {
    width: calc(10% - 21px);
}

.thirtyWidth {
    width: calc(30% - 21px);
}

.twentyWidth {
    width: calc(20% - 21px);
}

.mapWidgetBooking {
    height: 250px;
    width: 100%;
    display: block;
    border: 1px solid #FCC;
    margin: 0 0 40px 0;
}

.tableRow {
    float: left;
    font-size: 18px;
    width: 100%;
    display: block;
    border-bottom: 1px solid #999;
}

.controlButton {
    width: calc(100% - 48px);
    padding: 10px;
    background: #EEE;
    border: 0;
    margin-bottom: 20px;
    font-size: 18px;
    transition: 0.3s;
}

    .controlButton:hover {
        background: #F99;
    }

.progressMeter {
    width: 100%;
    height: 30px;
    margin-bottom: 20px;
}

.progressMeterBar {
    background: transparent;
    height: 15px;
    transition: 1s;
    padding: 5px 0;
    font-size: 18px;
    text-align: right;
    border-bottom: 5px solid red;
    width: 0%;
}

.height70fixed {
    height: 50vh;
    overflow-y: auto;
}

.bookingDetailsInner {
    overflow: hidden;
}

.bookingDetails {
    color: #000;
    float: left;
    display: block;
    border: 1px solid #FCC;
}


.icon {
    width: 44px;
    height: 44px;
    float: right;
    background-size: 60%;
    display: block;
    background-repeat: no-repeat;
    background-position: center;
}

.minimiseIcon {
    position: relative;
}

    .minimiseIcon::before {
        content: '';
        width: 11px;
        position: absolute;
        top: 20px;
        left: 7px;
        transform: rotate(45deg);
        height: 2px;
        background: #B00;
        display: block;
    }

    .minimiseIcon::after {
        content: '';
        width: 11px;
        position: absolute;
        top: 20px;
        left: 14px;
        transform: rotate(135deg);
        height: 2px;
        background: #B00;
        display: block;
    }

.maximiseIcon {
    position: relative;
}

    .maximiseIcon::before {
        content: '';
        width: 14px;
        height: 14px;
        border: 1px solid #B00;
        position: absolute;
        top: 8px;
        left: 8px;
        display: block;
    }

.listIcon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB6UlEQVRoge2ZzSuEQRzHfxQu3ESkvF+QRKEcOTgpB5GLg3IQOWo5uOHg5qDFYctBcVH+AAc5kYviJFyUvJRwkpfv9GyZdp/n2ZnZmXnWNt/6XLZnZ36fZ5/f9swMkZ4UgHrQIEilpnm1JQZ+JPgCzZFUGpA18AAGBJglT6InkkoDwgTuBK/tJcsCRaAVdIWwQ/ICEyHjdYBSHcVPg3cSe65lBUT6JE7eDVRKH/gGCTBI4c/1voLATIYxF5MSMVWBZfIas1DgWlM9cABOBcdNywa4TPmshvz/17dJXmA4YCz+hm2CG7Xy0wXGyE4PrJsSmEtOMOLDoYKAXw9cgD3TAn7R1QPHFKHAI/n/Oqks5KLAPMm9C32CxlwSYKkl8bfR8oAxIhXQESfAxwkoxAnwyWuBEvJed1c10W5boApcgxcNPIFJ2wKm4gT45LVAMXlrVR0NvALabAtUg1vS08TPYMq2gKk4AT55L9BNYpu5megHZbYF6khuCZmJJdsCLE0UvuErSif97X+6HuDjBBTiBPg4AYU4AT5BAmcGeTMp0AJ2kxOYZEinwJXqlzVli7IQYCuuD1ChrRy5sLOyc3CkOgDbLn8lb+XFDvHilmGnk6znRlUFWNiJOTv/uic9y0eZvaITMJ5N8f8iv8Sn5pGJXNrvAAAAAElFTkSuQmCC');
}

.gradeIcon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAADHklEQVRoge2aXYhNURTHl698JfJ1MeiieZhENx/zQEiY8DJ5mBCNjweieMOD7pQXvCh5mDxM+W4Y8YB4GJGHCXmRxIPUjVIKke+PwX/Z+3bXPXefc885d99z7uSs+tW9a6+9W/97zz5n7dUhMtt6sK/GWOeSa4k1gj81ynw/AprEhBx4HjM5kU9TUAFj/EyosnEOiQAvGwAmgQyYDAaFStPdqiZgHjgD3lHxRvsILoKloVMuNusChoAO8Ju87xjMZTCyovQtCxgGesT4C5AFi0EDWAj2gKci5gkYWysCLoixo6T+DZMNBPtBr469TWqvhDFrAlYK/2HDvNEG3y4xZ4vvlIvNmoA72veIzL/mCZf1uvW8Z/7yLTErAsaDX9q3yTAnP54xjK0Q680KkHjerAhYJnwTtW82WK45pMc6hK9Rx/Fz4Zseb41LwAb9/Sfop30pcEPESu6DGWLNnPbvjUtAs/ANFbEsJutIvp1Kn8Zv9NjOuARkhG+BI36z9ucfbFnHeFrMXR0weSJLAvqDV9p33BF/FVwD08Ap8NAx3qbnfQHDA6dv8TZ6UPt+gDnax5fTDirsC7aNYIL+zKI+6HknQyRPZFHAKPCaCiVEQ5l1uDJ9rOM/galBshZmtZRYQuof4DH+Zfmu4izWuF7aTgWxvDdawuX+z6xXo6vAexHzHdwDV0gVep/F2FdSl1QlVpXzAF/b58m7pL4OZlaQeN6qeiKrI3W5cGXaCY6B3WB6yGRNlpyJ47ZEgNPWkNqg3T45QupJzp2LTo84XrM5CgF3yf3O40Y9qUKuXFxPFAL4bHAOdPmEz8ZcavDBvt0jjtc0tWKSPRC3JQKcdgC8JdVS9MMDUgUetyJfesTxmm1RCLhF5e8mEm5uTaHCyc2Lm1EI4Dp/K9jmk0V6HnfrWjzieM26KAREbYkAp3FDl7sUc32SEnPrPeJ4zcFRCLhE5TejhM/D46i4t+RGVxQCzgYUwLdI7lxzd7u3TOzpKARwZzpN6tTlhxFibsojLk3mrneyieO2/1tAjvrgqwZ9/mUPNn61Je7Xa5ysNSX6F+tlltM6BmHgAAAAAElFTkSuQmCC');
}

.editCandidateIcon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAAC/UlEQVRoge2YS2wOURTHj0dJ41WJIh4LITZYEImNHdWViggRdNEFsUBIPdOtjUeaIA31Wgo+VTtaIipBuiqJiJQNSReCRAQlnv+Te5vvzP345sx1x3yR+Se/5Es7/3P/M3Nn7pxLlCtXRWkMaAQF0A8+WJ6Cy2ADqM4sXYyawAD4GcNLMidSMRoB2ig+uMsxMDyDvCXiIDLYC9AM5pOZUswCsI9K79ChDPJGtJKigc5R+TnOJ3NBHP8D1KWcsaz6RJiLSs8w0Cl8velEi9dSEeI9mJjAWws+Cv+S4OkUahEBTnn4zwr//oC51OoQAXxei43CXwiYS60uEWCZh79O+K8HzKVWtwhQ7+GvF/7ugLnUOi0CbPPw7xD+9oC51NopAlz18F8T/u0Bc6k1WwQYBFMSeKeCz1RczGYFT6fUAyqeRFsCX7vw3Ushl1ryQeQruUrhWW2PHfItTy2dUnIu81RaV+bY9VScOkxH6ukU4k+I5xT9qOOHmteGCaCGzFXudI7pt/+vCM0ET0jfCzwGMzJJWkZ8J85QdH67fCfzANdklFElbl6OgofgnYV/HyHT5OTK9T9qMmgAB8l8ZvNbhhv4T5YB+7cue0yD9WQqbtA3kQn1jZJvq7DnBthoa/0zVYEt4JVH6D/xlsy2y+i0w/O3j7vqDl3NHjL7PGvAPDCNzBZLtf3Nr9C14DC4S2ZNcOs8I7/mKFa8FdLym0F5wD1gukdN9uyl0gvCYxywYwYRT5mCM8hrMk1IVYD6o8h0Z2+cMS6BkQHqR1pH5iaYFKKwI655yxnr5N8W3e0UbCWzmZuW+Iq7e627fIstpujr8XyAgFrJjo0zLPIp0iuK3KEw810rfi56xPj3kxaQrSLvYWbRdPOmwaDIkWgXW3ZPrcGj6XVc5LiiNY2jaN86J5VoOs0VOfhujNWYVghTX2rR9HpECaeR3PI7kV4uteQ02qoxNAlDuf42CzZrTmA8mT4267AunKlWcwKshWS2/L5UQPCv4DZ5Lma5csXoF/Vwo/qx4ftaAAAAAElFTkSuQmCC');
}

.deleteCandidateIcon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAADJklEQVRoge2YSWgVQRCGyyVKcItgVFwOLuSiHpSAF8GDxpyMiiii5pCD4kGj4k6uXlwIqASN21HUZ4w3TSJiBJWcoiAiiReFHMSFIGoUt1TRPbyafi8zNT09zkPmhw8eyfzV/8z0TE81QKZMJasJSD2SQ/qQL5pXyE1kK1KeWroQNSADyN8Q3oI6kZLRGKQFwoObnEFGp5C3QBSEB3uDHEAWg5pSxBLkCBTeoRMp5PVpLfgDXYHgOU4nc40d/wepSThjoHpZmOtCzyiknfl6kokWrhUsxGdkagRvJfKV+Zc7TydQEwtwwcJ/mfmPOswlVhsLYPNarGf+nMNcYnWwAKss/DXMf9dhLrE6WYBaC38t83c6zCXWRRZgt4W/kflbHeYSax8LcNvCf4f59zjMJdYCFmAImRHBOxP5DvnFbJ7zdEI9hfxJtETwtTLf4wRyicUfRLqS6wSeDfpYz7c6sXRC8blMU2lzwLFbID91iLY4A08G9fHVJeQesr5IHfqEeM1CeQ81rQ1TkApQV7ndOKZP/99ae42CEj6NUGsu8jJCnRfInDjhSSuRnxFPoCugHt2JS+Cf3ya/QT3AFXHDe5oP6vZKoC/G8YKa1LycRp4hgxr6fQpUk5Mp0/+o6UgdchzUZza9ZaiB/6YZ0H/r0MfUaU+qogZ9O6hQvyD6K5k8tLZs07X+mcqQncg7i9Aj8RHUtovkLRdL9O1jrrre1ewGtc+zEVmEzAK1xVKuf9MrdBNyEnkEak0w6/SDXXMUKtoKaSoyKA14CJltUZM8h6HwgtAYx/SYTkRTJmcM8h5UE1LmoP44UN3ZB2OMG8hYB/V9raP3OTHNRWFDVPO+Mdb5uEUPGgWbQW3mJiW64uZe637bYtXgfz1edRBQKt6xUYZlNkV6WJGH4Ga+S0XPRTcb/0nUArxVpD3MNJpu2jQYYjki7WLz7qnZeTS5zrIct6SmSeDvWxcmEk2mKpaD7sZEiWkNM/UmFk2u5xBxGvEtv3PJ5RKLT6NdEkMDMwT1t2mwQ3ICtN0yWAJhTShTpeQESEtBbfn9KIHgtHPyACwXs0yZimgYnUjKPqdGwmkAAAAASUVORK5CYII=');
}

.addCandidateIcon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAADYklEQVRoge1YSWhUQRAtlyjBLYJRcTm44EU9KIIgggMaczIqooiaQw6Kh7gRV3L14kJAJWjcjqKOMd40C2oElYAQBRGJXhRyEDVEUaO4VtH9mZqemf+re/o7c5gHD0KmX9Xr/7t/dxVACSUULcYga5FJZB/yi+ZL5HXkFmR5wdxFoA7Zj/wbwbegJlI0GIFshmjjJk8hhxfAbwbICDf2BtmAXABqSREXIg9B5hs6VgC/aVgD6YYuQfgap8lcYeP/IKti9hiKXmbmqlAzDNnGdD3xWIvGcmbiM3KihbYS+ZXpl3p3J0AjM3DOQX+R6Q979CVGKzPg8lmsZfqkR19itDMDKx30VUx/26MvMTqYgWoHfTXTd3j0JcZ5ZqDeQb+b6Vt8mRqF7EJ+Qq6LGLuXGbjpkOsW0+9y0GfFMpC/1jls7BByikWeqcjvkDrMZlk7zYEEM3VPMP4xG99skaeF6R7aWQxHAuwmwDciPcm1As16PTbQrXIxmgsJsJsAga9lWkqbQsZuhtTSIba6GiWMB3X56mR8woIPGL/dgewbm64Qr5ku2NR0NkxAVoB6ym3GmD79uzP2GAElHMgRaybyhUWc58gZ+ZgnrED+tJxAZ0g8ehMXIH19m/wNagNX5Gs+wGxQrzdgA0v21PiNboyjBTGpeDmp9YOa9PcJUEVOrEiA/SYuKiSgNIHCgo70X5Cqb6WYjKxBHgV1zaavDBXw3zT79f/a9ZgarYkFCVA3xXER46hA36ZNBZO2IWnobNmqY/03lCF3IN85mM7Fj6DaLpKvXF6gu4956gZPsxtUn2cDcj5yGqgWS7n+mz6hG5HHkQ9AnQlmnFfgVhxFglohjVmSUsIDyOkOMUlzEDIfCOU4onN6AS2ZpJHkPagipMxDfCqiaM99MHJcQ470ED+tdAyuE5N8BDZAMbuMXGfzDbrfCNgEqpkbF+iJm73Wfa7BlkD65/GyB4NS8IqNPCx2CdLDgtwHP+tdCtoX3Sz/I9sAvFSkHqa3otsC1DQYYj6suti8emrybk2O08zHDamIrhC8bp0bizUZ5jEf9DbGSkSrmag3NmtyPAPLZcRbfmfi8yUGX0Y7JYI6JgirbwvB7ZIJULtlsAjMmiRPlZIJEBaBavn9KALj1Dm5C46HWQklZME/S6jnksJxiDwAAAAASUVORK5CYII=');
}

.printerIcon {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAACXBIWXMAAAsTAAALEwEAmpwYAAACDElEQVRoge2aPUvDQBjHH3VS+yFEXEXQLyDi4lfQ3UkQiq2zU51KP4IgQlvcxMVurnUpSJfi5CgKtrZqW6rPkSclaZPLJfdmsH/4QcJd755fXi9QALEcIX3kR5JnZENwTqW5S1BsGC9gQaJGkz8ghwm4BssSrkAl4e9P6PdD5BssSKgSeEf2kC/af0O2VBQYFZUCLMYlVAuwGJXQIcBiTEKXAIsRCZ0CLNolVAl8gFNcEGfgf0+sy5Xsj6zAMcR/Y9/LleyPrMAaOJdGHIFHuZL9kRVgWUQ2IfwScnHXXTWJuaaiQkA0FfhvAuy05ZFTDi0atBHRTwUNmqsV0S9PtcMrqFvrm4bVPt7pgvOkSANdT93jDfbhkZawWv+8wBKyjewSbHuZ2lIhcAPT1/wttaVC4BKmBa6oLRUC88gKskqw7QVqS4UALzMB25kJ2E5sgQxEr+NVk1EpUPf0M0VdpUDHgkBHh0AR9F86xaQCTXC+goIYUp8sZ1BVydJcA049Ta/AJ4ifVpMCI4F6WO1wAM53aJXDIEQgB+FHSZRciEA/oqYK1S4U9x7wCswhPYGjFEWPxpoU4N0DsRMkwLKPlIF/pHiUaQxvjAroyEwgKGECJeRJkpJNARVv6MlCjQrsIAXkPCEFGsOagI7MBILiCrBnd5K/GsShqkOgDeaX022VAhcgtrhSxYjmjMwvb9G1gG/CgzsAAAAASUVORK5CYII=');
}

.searchResultHeader {
    font-size: 24px;
    border: 1px solid #D00;
    color: #D00;
    float: left;
    margin: 20px 0;
    padding: 10px;
    width: 300px;
    text-align: center;
}

.deleteButton {
    border-radius: 999px;
    border: 0;
    background: #D00;
    color: #FFF;
    width: 20px;
    height: 20px;
    position: absolute;
    right: 0%;
    top: 12px;
}

.rr-section-header {
    margin-top: 30px;
    font-weight: 600;
    float: left;
    width: 100%;
}

.rr-result-input {
    float: left;
    width: 100%;
}

.readingReportHeader {
    margin-top: 80px;
    border-top: 3px solid #D00;
}

.rr-notes-input {
    float: left;
}

.readingReportNote {
    width: calc(100% - 5px);
    resize: none;
    margin: 10px 0;
    height: 100px;
}

.rr-criteria-comment {
    float: left;
    width: 100%;
    resize: none;
    height: 80px;
    margin: 10px 0;
}

.rr-criteria-item {
    float: left;
    width: 80%;
    margin-left: 20px;
}

.searchRow {
    min-width: 100%;
    border-bottom: 1px solid #333;
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
}

    .searchRow:hover {
        background: #FCC;
    }

.readingGrid tbody tr td {
    text-align: left;
    vertical-align: top;
    border-right: 1px solid black;
    padding: 10px;
}

.searchColumn {
    flex: 0 0 200px;
    padding: 10px;
}

.row {
    font-size: 16px;
    margin: 5px;
    width: calc(50% - 10px);
    float: left;
}

.bookingInputLarge {
    float: right;
    width: calc(100% - 200px);
    padding: 10px;
    height: 125px;
    margin-right: 10px;
    resize: none;
    font-size: 16px;
    border: 1px solid #AAA;
    font-family: 'Quicksand', Arial, Arial, Helvetica, sans-serif;
    font-weight: 600;
}

.bookingInput {
    float: right;
    width: calc(100% - 130px);
    padding: 10px;
    font-family: 'Quicksand', Arial, Arial, Helvetica, sans-serif;
    font-weight: 600;
    font-size: 16px;
    border: 1px solid #AAA;
}

.bookingDetails {
    padding: 10px;
    margin-bottom: 10px;
}

.expandedBooking {
    display: none;
}

.bookingColumn {
    float: left;
    width: 25%;
    display: block;
    height: 50px;
}

.qualPicker {
    float: right;
    width: 50%;
    padding: 10px;
}

.bookingButton {
    display: inline-block;
    padding: 1vh 1vw 1vh 1vw;
    border: 1px solid #CCC;
    border-radius: 5px;
    font-size: 16px;
    background: #;
    margin: 10px 10px 10px 10px;
    color: #000;
    transition: 0.3s;
    background-color: #fff;
}
    /*change*/
    .bookingButton:hover {
        background: #F00;
        color: #FFF;
    }
        /*change*/
        .bookingButton:hover i {
            margin-left: 15px;
            border: solid #fff;
            border-width: 0 3px 3px 0;
            display: inline-block;
            padding: 6px;
        }
/*change*/
.arrow {
    margin-left: 15px;
    border: solid #D00;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 6px;
}
/*change*/
.right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}

.sessionControls {
    margin-top: 5px;
    height: 80px;
    width: 100%;
    text-align: center;
}

.dialogBoxLarge {
    transform: translateX(250%);
    position: absolute;
    top: 100vh;
    height: calc(90vh - 100px);
    width: 60vw;
    left: 390px;
    border: 1px solid #F66;
    z-index: 100;
    transition: 0.3s;
    background: rgba(255,255,255,1);
    border-radius: 20px;
}

.dialogBoxColumn {
    position: absolute;
    top: 110vh;
    height: calc(100vh - 130px);
    width: calc(30vw - 50px);
    left: 250px;
    border: 1px solid #F66;
    z-index: 100;
    transition: 0.3s;
    background: rgba(255,255,255,1);
    border-radius: 20px;
}

.debugWindow {
    position: absolute;
    top: 130vh;
    min-height: 280px;
    width: 60vw;
    max-height: 75vh;
    left: 20vw;
    border: 5px solid #F66;
    display: flex;
    flex-direction: column;
    z-index: 100;
    transition: 0.3s;
    background: rgba(255,255,255,0.85);
}

.debugWindowHeader {
    background: #333;
    float: left;
    width: calc(100% - 20px);
    font-weight: 700;
    padding: 10px;
    color: #FFF;
}

.debugWindowContent {
    background: #000;
    font-family: Consolas;
    color: #FFF;
    overflow-wrap: break-word;
    padding: 20px;
}

.dialogBox {
    position: absolute;
    top: 130vh;
    min-height: 280px;
    width: 60vw;
    max-height: 75vh;
    left: 20vw;
    border: 1px solid #F66;
    display: flex;
    flex-direction: column;
    z-index: 100;
    transition: 0.3s;
    background: rgba(255,255,255,0.85);
}

.dialogBoxHeader {
    border-radius: 20px;
    background: #EAEAEA;
    float: left;
    width: 100%;
    font-weight: 700;
    color: #D00;
}

.disabledRow {
    background: #CCC !important;
    color: #999 !important;
}

.dialogBoxInner {
    overflow-y: scroll;
    padding: 10px;
    height: calc(100% - 90px);
    margin: 50px 10px 0px 10px;
    width: calc(100% - 40px);
}

.toast {
    width: 200px;
    min-height: 50px;
    background: #F00;
    transition: 0.3s;
    color: #FFF;
    position: absolute;
    top: 130vh;
    text-align: center;
    font-weight: 700;
    border-radius: 15px;
    font-size: 18px;
    padding: 20px 10px;
    right: 20px;
}

.loginStatus {
    float: left;
    padding: 20px;
    font-weight: 600;
    font-size: 18px;
    transition: 0.3s;
}

.loginInput {
    width: calc(100% - 60px);
    margin: 15px;
    padding: 15px;
    border: 0;
    background: #EEE;
    color: #000;
    font-size: 16px;
    border-radius: 10px;
}

.loginBox {
    border-radius: 5px;
    box-shadow: 0 13px 40px rgba(40,40,40,.2);
    width: 20vw;
    min-width: 350px;
    height: 62vh;
    min-height: 650px;
    max-height: 75vh;
    left: 40vw;
    border: 1px SOLID #D8D8D8;
}

    .loginBox h3 {
        margin: 0 0 0 20px;
        font-size: 16px;
        font-weight: 500;
        float: left;
    }

.loginBoxHeader {
    align-items: center;
    border-top-right-radius: 25px;
    border-top-left-radius: 25px;
    background: none;
    margin: 60px auto 10px auto;
    color: #000;
}

.loginButtons {
    color: #FFF !important;
    background: #D00 !important;
    width: 75%;
    margin: 25px auto 0px auto !important;
}

    .loginButtons:hover {
        transition: 0.5s;
        transform: scale(1.05) perspective(1px);
    }

.registerButton {
    color: #D00 !important;
    background: #FFF !important;
}

.forgotPassword {
    font-size: 15px;
    margin: -5px 0 0 25px;
}

.hubRegistrationContainer {
    padding: 20px;
    line-height: 40px;
}

.assessorReportSectionScore {
    float: right;
    border: 1px solid #D00;
    padding: 10px;
    border-radius: 999px;
    margin-top: -43px;
    background: #FCC;
    font-size: 24px;
}

.registrationInput {
    width: calc(100% - 60px);
    margin: 15px;
    padding: 15px;
    border: 0;
    background: #EEE;
    color: #000;
    font-size: 16px;
}

.esbWarning {
    background: #F00;
    color: #fff;
    float: left;
    width: 100%;
    padding: 0 0 0 10px;
    height: 0;
    overflow-y: hidden;
    transition: 0.3s;
}

.slimRow {
    width: calc(100% - 20px);
    float: left;
    display: block;
    padding: 5px 0;
}

.row {
    font-size: 20px;
    width: calc(100% - 20px);
    float: left;
    display: block;
    padding: 10px;
    border-bottom: 1px solid #eee;
}

h2 {
    padding-left: 20px;
}

.rowInner {
    font-size: 16px;
    margin: 20px 10px 0px 40px;
}

.checkInput {
    margin: 0 20px 0 0;
}

.textInput {
    width: calc(100% - 40px);
    margin: 10px 0 0 0;
    padding: 10px;
}

.textareaInput {
    width: calc(100% - 40px);
    margin: 10px 0 0 0;
    padding: 10px;
    height: 200px;
}

.standardButton {
    padding: 10px 20px;
    background: #FFF;
    color: #D00;
    border: 2px solid #D00;
    border-radius: 25px;
    font-size: 20px;
    float: right;
    display: block;
    margin: 10px 20px 20px 20px;
}

.smallControlButton {
    padding: 10px 20px;
    border: 0;
    background: #F33;
    color: #FFF;
    margin: 10px;
}

.collapsibleRowContent {
    width: calc(100% - 40px);
    padding: 20px;
    height: calc(100% - 110px);
    float: left;
}

.thirdRow {
    font-size: 16px;
    margin: 5px;
    width: calc(33.3% - 10px);
    float: left;
}

.examBox {
    padding: 10px;
    background: #FFF;
    float: left;
    width: 64vw;
}

.bookingBox {
    padding: 10px;
    background: #FFF;
    float: left;
}

.sessionBox {
    padding: 10px;
    background: #FFF;
    float: left;
}

.bookingInputThird {
    float: right;
    min-width: 100px;
    width: calc(50% - 150px);
    padding: 5px;
}

.fullRow {
    font-size: 16px;
    margin: 5px;
    width: calc(100% - 10px);
    float: left;
}
.halfRow {
    font-size: 16px;
    margin: 5px;
    width: calc(50% - 10px);
    float: left;
}

.bookingInput {
    float: right;
    width: calc(100% - 230px);
    padding: 5px;
}

.welcomeMessage {
    position: absolute;
    right: 30px;
    width: 65%;
    background: #FFF;
}

.welcomeMessageHeader {
    font-size: 24px;
    margin: 30px 0;
    font-weight: 600;
}

.welcomeMessageSubheader {
    font-size: 20px;
    margin: 30px 0;
}

.resultsRow {
    border-bottom: 1px solid #CCC;
    padding: 10px;
    font-weight: 500;
    height: 30px;
    overflow: hidden;
}

.resultsRowTitle {
    float: left;
    height: 50px;
    display: block;
}


.collapsibleRowSet {
    height: max-content;
    overflow: hidden;
    width: calc(100% - 20px);
    margin: 10px;
}

.collapsibleRow {
    height: 50px;
    transition: 0.3s;
    overflow: hidden;
    border-bottom: 1px solid #999;
}

.collapsibleRowTitle {
    height: 30px;
    transition: 0.3s;
    font-size: 20px;
    font-weight: 600;
    padding: 10px;
}

    .collapsibleRowTitle::after {
        content: '';
        display: block;
        margin: 8px;
        border-width: 10px 10px 0px 10px;
        float: right;
        border-style: solid;
        border-color: #F00 transparent transparent transparent;
    }


.standardInput {
    padding: 10px;
    border: 0;
    background: #EEE;
    margin: 10px;
    float: right;
    width: calc(100% - 40px);
    border-radius: 10px;
    width: calc(100% - 40px);
}

.standardInputCheckbox {
    padding: 10px;
    border: 0;
    background: #EEE;
    height: 30px;
    width: 30px;
    margin: 20px 10px;
    border-radius: 20px;
}

.standardInputSelect {
    padding: 10px;
    border: 0;
    background: #EEE;
    margin: 10px;
    width: calc(100% - 20px);
    border-radius: 20px;
}

.progressMeterBlob {
    border: 1px solid #FFF;
    border-radius: 999px;
    margin-right: -25px;
    margin-left: 25px;
    margin-top: 4px;
    line-height: 35px;
    text-align: center;
    font-weight: 900;
    color: #FFF;
    height: 35px;
    width: 45px;
}

.dialogSubHeader {
    font-size: 24px;
    float: left;
    width: 100%;
    border-bottom: 1px solid #D00;
    padding: 5px;
}

.inputRow {
    float: left;
    display: block;
    position: relative;
    width: 40%;
    padding: 15px;
}

.inputRowHeader {
    padding: 15px;
    font-weight: 600;
    text-align: right;
}

.inputButton {
    background: #F00;
    color: #FFF;
    padding: 15px 30px;
    border: 0;
    border-radius: 15px;
    bottom: 20px;
    float: right;
    margin-top: 10px;
    margin-right: 20px;
    font-size: 22px;
}

.formBreak {
    border-top: 3px solid #F00;
    width: calc(100% - 50px);
    margin: 0 25px;
    float: left;
}

.halfWidth {
    width: 50%;
    float: left;
    display: block;
}

/* data grid styling */

.loadingCircleContainer {
    width: 100%;
    height: 100%;
    position: relative;
}

.loadingCircle {
    width: 200px;
    height: 200px;
    position: absolute;
    left: calc(50% - 100px);
    top: calc(65% + 5px);
    border-radius: 999px;
    border: 10px dotted #D00;
    animation: spinForever 1s infinite;
}

@keyframes spinForever {
    0% {
        transform: rotate(0deg)
    }

    25% {
        transform: rotate(90deg)
    }

    50% {
        transform: rotate(180deg)
    }

    75% {
        transform: rotate(270deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

.dataGrid {
    border: 1px solid #DBB;
    width: 90%;
    height: 90%;
    overflow: hidden;
    margin: 5%;
}

.dataGridHeader {
    padding: 10px;
    background: #FFF;
    color: #D00;
    font-weight: 600;
}

.dataGridInner {
    margin: 0;
    height: calc(100% - 190px);
    overflow-y: scroll;
    transition: 0.3s;
    border: 1px solid #DDD;
}

.rowHeader {
    margin: 0 0 30px 0;
    color: #D00;
    border-bottom: 1px solid #DBB;
    font-size: 16px;
    background: #FFF;
    padding: 10px;
}

.dataGridRowHeader {
    font-weight: 600;
    width: max-content;
    overflow-y: hidden;
    font-size: 16px;
    border-bottom: 1px solid #DBB;
    background: #FFF;
}

.dataGridRow {
    width: max-content;
    font-size: 16px;
    overflow-y: hidden;
}

.darkRow {
    background: #FFF5F5;
}

.dataGridControls {
    background: #FFF;
    height: 68px;
}

.resultSaveButton {
    background: #D00;
    color: #FFF;
    padding: 10px;
    float: right;
    font-size: 18px;
    border: 0;
}

.bulkResultSaveButton {
    background: #D00;
    color: #FFF;
    padding: 10px;
    float: right;
    font-size: 24px;
    border: 0;
    position: absolute;
    top: 40px;
    right: 50px;
}

.deleteBookingBtn {
    background-color: #ff4d4d;
    color: white;
    border: none;
    border-radius: 3px;
    padding: 3px 8px;
    cursor: pointer;
    font-size: 0.85em;
    margin-left: 5px;
}

    .deleteBookingBtn:hover {
        background-color: #ff0000;
    }

.bulkResultSaveButton:nth-child(2n+1) {
    background: #D00;
    color: #FFF;
    padding: 10px;
    float: right;
    font-size: 24px;
    border: 0;
    position: absolute;
    top: 40px;
    right: 410px;
}

.assessorReportSectionHeader {
    width: 100%;
    float: left;
    font-size: 18px;
    margin: 15px 0;
    border-bottom: 1px solid #D00;
    padding: 5px 0;
    font-weight: 600;
    height: 30px;
}

.assessorReportNote {
    float: left;
    width: calc(100% - 40px);
    height: 100px;
    margin: 20px 10px;
    border: 1px solid #D00;
    resize: none;
    padding: 10px;
}

.assessorReportRow {
    width: 30%;
    float: left;
    height: 100px;
    border: 3px solid #FFFAFA;
    padding: 10px;
    background: #FFFAFA;
}

    .assessorReportRow:nth-child(5),
    .assessorReportRow:nth-child(6),
    .assessorReportRow:nth-child(9),
    .assessorReportRow:nth-child(10) {
        background: #FFF;
    }

.assessorReportRowHeader {
    width: 100%;
    float: left;
    display: block;
}

.assessorReportInput {
    width: 20%;
    float: left;
    display: block;
}

.assessorReportColumn {
    float: left;
    margin: 10px;
    width: calc(15% - 20px);
}

    .assessorReportColumn label {
        font-size: 1em;
        margin-left: 12px;
    }

    .assessorReportColumn input {
        height: 2em;
        width: 2em;
    }


.assessorReportHeader {
    border-bottom: 1px solid #D00;
    font-size: 1em;
    font-weight: 600;
    margin-top: 30px;
    width: 100%;
    float: left;
}

.assessorReportControls {
    width: 100%;
    display: block;
    position: absolute;
    top: -10px;
    left: -20px;
    float: left;
}

.assessorReportDesignButton {
    background: #D00;
    color: #FFF;
    padding: 10px 30px;
    margin: 10px;
    border: 0;
    font-size: 18px;
    float: right;
}

.reportDesignerContainer {
    position: relative;
}

.assessorReportFieldInput {
    padding: 10px;
    margin: 5px 0;
    border: 1px solid #666;
    width: calc(100% - 30px);
}

.assessorReportSectionDesign legend {
    font-size: 18px;
    padding: 10px 30px;
    background: #FFF;
    border: 2px solid #D00;
}

.assessorReportRowDesign legend {
    font-size: 18px;
    padding: 10px 30px;
    background: #FFF;
    border: 2px solid #333;
}

.jsonRawInput {
    padding: 12px;
    width: 50%;
    border: 1px solid #666;
    background: #DDD;
    margin: 10px;
    float: left;
}

.longAssessorReportInput {
    width: 100%;
    float: left;
    display: block;
}

.shortAssessorReportInput {
    width: 100%;
    float: left;
    display: block;
}

.assessorReportSectionDesign {
    background: #EEE;
    margin: 25px 10px;
    border: 2px solid #D00;
}

.assessorReportScoreDesign {
    float: left;
    margin: 15px 10px;
    width: calc(15% - 32px);
}

.assessorReportBoundaryDesign {
    float: left;
    background: #DDD;
    margin: 15px 10px;
    width: calc(15% - 32px);
}

.assessorReportRowDesign {
    float: left;
    background: #FFF;
    margin: 15px 10px;
    width: calc(100% - 50px);
}

.dataGridButton {
    width: 50px;
    height: 50px;
    margin: 8px;
    border: 0;
    float: left;
    background: #FFF;
    border: 1px solid #DBB;
    position: relative;
}

    .dataGridButton::before {
        content: '';
        display: block;
        width: 18px;
        position: absolute;
        top: 28px;
        left: 20px;
        transform: rotate(135deg);
        height: 3px;
        background: #D00;
    }

    .dataGridButton::after {
        content: '';
        display: block;
        width: 18px;
        position: absolute;
        top: 17px;
        left: 20px;
        transform: rotate(45deg);
        height: 3px;
        background: #D00;
    }

.dataGridCellHeader {
    float: left;
    width: 300px;
    border-right: 1px solid #DDD;
    padding: 10px;
    overflow: hidden;
    height: 30px;
}

.dataGridCell {
    float: left;
    width: 300px;
    border-right: 1px solid #DDD;
    padding: 10px;
    overflow: hidden;
    height: 30px;
}

.gridSelector {
    width: 15px;
    z-index: 1;
    height: 15px;
}

.microCell {
    width: 35px;
    text-align: center;
    background: #EEE;
}

.shortCell {
    width: 80px;
}

.mediumCell {
    width: 130px;
}

.dialogBoxTitle {
    float: left;
    padding: 10px;
}

.dialogBoxControls {
    float: right;
    margin-right: 5px;
}

.dataGridPageNumber {
    float: left;
    display: block;
    background: #FFF;
    margin: 8px;
    height: 50px;
    width: 100px;
    text-align: center;
    font-size: 24px;
    line-height: 50px;
}

.dataGridPageSize {
    background: #FFF;
    float: left;
    display: block;
    width: 260px;
}

.dataGridPageSizeLabel {
    float: left;
    width: 170px;
    font-size: 16px;
    line-height: 60px;
    text-align: center;
}

.dataGridPageSizeInput {
    padding: 10px;
    margin: 8px 4px;
    border: 0;
    border: 1px solid #FCC;
    font-size: 16px;
    width: 80px;
    padding: 15px;
}

.dataGridPageButtons {
    float: left;
    margin: 8px;
    height: 50px;
    width: 260px;
}

.dataGridPageButton {
    border: 0;
    height: 50px;
    background: #FFF;
    border: 1px solid #FFF;
    color: #000;
    margin: 0 3px;
    width: 30px;
    font-size: 18px;
}

.dataGridFilters {
    float: left;
    transition: 0.3s;
    position: relative;
    height: 80px;
    overflow-y: hidden;
    width: calc(100% - 280px);
    display: block;
}

.dataGridFilterItem {
    padding: 10px;
    float: left;
    width: 25%;
    display: block;
}

.dataGridFilterTitle {
    font-weight: 500;
    font-size: 16px;
    padding: 0 10px;
    text-transform: capitalize;
}

.dataGridFilterInput {
    padding: 10px;
    background: #FEE;
    width: 90%;
    border: 0;
    margin: 5px;
}

.dataGridFilterButton {
    background: #FFF;
    border: 0;
    color: #D00;
    padding: 15px;
    font-size: 20px;
    border: 1px solid #DBB;
    float: right;
    margin: 0;
    display: block;
}

    .dataGridFilterButton:first-child {
        background: #D00;
        color: #FFF;
    }

.dataGridSearchButtons {
    float: right;
    transition: 0.3s;
    height: 80px;
    width: 280px;
}

/* test form*/

.testForm {
    border: 1px solid #FCC;
    float: left;
    display: block;
    width: 100%;
}

.testFormRow {
    float: left;
    width: 100%;
    padding: 10px;
    display: block;
    border-bottom: 1px solid #CCC;
    height: 40px;
    color: #000;
}

.testFormInput {
    padding: 10px;
    width: calc(100% - 40px);
    border: 0;
    background: #EEE;
}

.disabledButton {
    text-decoration: line-through;
    color: #CCC;
    border-bottom: 1px solid #555 !important;
}

/* finance */
.financeGridSearcher {
    position: relative;
}

.financeGridSearcherInput {
    padding: 0 15px;
    margin: 15px 20px;
    float: left;
    width: calc(100% - 350px);
    height: 50px;
    border: 1px solid #DBB;
}

.searchIcon::before {
    content: '';
    display: block;
    width: 3px;
    height: 23px;
    background: #D00;
    transform: rotate(45deg);
    position: absolute;
    bottom: -56px;
    right: 10px;
}

.advancedIcon {
    width: 100px !important;
}

.searchIcon::after {
    content: '';
    display: block;
    width: 17px;
    height: 17px;
    border: 3px solid #D00;
    background: #FFF;
    border-radius: 999px;
    transform: rotate(45deg);
    position: absolute;
    bottom: -46px;
    right: -10px;
}

.financeGridButton {
    border: 1px solid #DBB;
    width: 50px;
    height: 50px;
    float: right;
    background: #FFF;
    margin: 15px -20px 0 40px;
}

.financePriceRow {
    width: calc(50% - 100px);
    float: left;
    padding: 5px 10px;
    background: #FFF;
    margin-right: 10px;
}

.financeRowInnerPriceCell {
    float: left;
    line-height: 40px;
    width: 180px;
}

.financeRowInnerDateCell {
    float: left;
    margin-left: 10px;
    line-height: 40px;
    width: 260px;
}

.financeRowInnerDateInput {
    float: right;
    width: 120px;
    padding: 10px;
    border: 1px solid #FCC;
}

.financeRowInnerPrice {
    float: left;
    width: 90%;
    margin-left: 50px;
}

.financeRowInnerPriceInput {
    float: right;
    width: 50px;
    padding: 10px;
    border: 1px solid #FCC;
}

.financeRowInner {
    float: left;
    margin: 0 0 0 60px;
    border-top: 1px solid #FCC;
    width: calc(100% - 173px);
    padding: 10px;
    background: #FFF;
}

.financeCellHeader {
    background: #FFF;
    float: left;
    padding: 5px 10px;
    font-size: 12px;
    width: calc(100% - 20px);
}

.financeConditionButton {
    float: right;
    margin-right: 10px;
    margin-top: 4px;
    background: #FDD;
    color: #000;
    border: 0;
    font-size: 16px;
    height: 38px;
    padding: 8px 12px;
}

.financeCellSelect {
    padding: 10px;
    border: 1px solid #FCC;
    background: #FFF;
    width: calc(100% - 2px);
}

.financeCellInput {
    padding: 10px;
    border: 1px solid #FCC;
    background: #FFF;
    width: calc(100% - 23px);
}

.financeCellWide {
    width: 40%;
    float: left;
    display: block;
}

.financeCell {
    width: 15%;
    float: left;
    display: block;
}

.financeGridInner {
    background: #FFF;
}

.financeRow {
    margin: 0;
    float: left;
    width: calc(100% - 10px);
}

.financeRowHeaderInner::before {
    border-width: 0 0 1px 1px;
    border-color: #DAA;
    border-style: solid;
    content: '';
    display: block;
    width: 30px;
    height: 5000%;
    top: -4900%;
    left: -30px;
    position: absolute;
    z-index: 1;
}

.financeRowHeaderInner {
    font-size: 16px;
    margin: 0px 0px 0px 40px;
    width: calc(100% - 155px);
    background: #FFF;
    border-width: 1px 0 0 1px;
    border-color: #DAA;
    border-style: solid;
    padding: 10px;
    color: #000;
    font-weight: 500;
    position: relative;
    float: left;
}

.financeRowDark {
    font-size: 16px;
    width: 100%;
    padding: 5px;
    float: left;
    background: #F6F6F6 !important;
}

.financeRowHeader {
    font-size: 16px;
    width: 100%;
    padding: 10px;
    float: left;
    z-index: 3;
    font-weight: 500;
    position: relative;
    background: #E9E9E9;
}

.financeButtonHeader {
    margin-left: 20px;
}

.financeGrid {
    width: 100%;
    border: 1px solid #FCC;
    margin: 20px;
    float: left;
    font-size: 16px;
    overflow-y: auto;
    overflow-x: hidden;
    height: 50vh;
    background: #FFF;
}

.financeButton {
    width: calc(100% - 40px);
    padding: 20px 0;
    font-size: 20px;
    background: #FFF;
    float: left;
    border-bottom: 1px solid #FCC;
}

.financeSidebar {
    width: 20vw;
    margin: 0px;
    float: left;
    background: #F6F6F6;
    height: calc(100vh - 40px);
}

.sidebarButton {
    width: calc(100% - 10px);
    float: left;
    border: 0;
    background: transparent;
    border-color: #FCC;
    border-style: solid;
    border-width: 0 0px 1px 0;
    font-size: 1rem;
    margin: 10px 0px 0 0px;
    padding: 15px 0;
}

.financeContent {
    width: calc(74vw);
    float: left;
    border: 1px solid #FCC;
    margin: 35px 20px;
    position:relative;
    height: calc(100vh - 260px);
    overflow-y: auto;
}



/* documents */

.documentButton {
    margin: 35px 0 0 10px;
    background: #D00;
    color: #FFF;
    border: 0;
    padding: 10px;
}

.documentContainer {
    width: calc(100vw - 140px);
    height: calc(100vh - 145px);
    position: absolute;
    top: 80px;
    border: 0px solid #FFF;
    left: 20px;
}

.documentContainerInner {
    width: 100%;
    height: 100%;
    float: left;
    display: block;
    margin: 0;
    border: 1px solid #F00;
}
/* history */
.historySidebar {
    right: -26vw;
    height: calc(100vh - 40px);
    transition: 0.3s;
    z-index: 6;
    top: 40px;
    background: rgba(255,255,255,0.75);
    border: 1px solid #FCC;
    overflow-x: hidden;
    width: calc(20vw - 40px);
    position: absolute;
    border-right: 6vw solid #FDD;
    display: none;
}

.userHistoryTime::before {
    position: absolute;
    content: '';
    display: block;
    border-style: solid;
    border-width: 30px 30px 0 0;
    top: 1px;
    left: -29px;
    border-color: transparent #FCC;
}

.historySidebarInner::-webkit-scrollbar {
    display: none;
}

.historyRowTimeSpan {
    background: #FEE;
    padding: 10px;
    font-size: 16px;
    font-weight: 600;
}

.userHistoryTime {
    background: #FCC;
    color: #000;
    padding: 5px 10px;
    height: 20px;
    margin-top: 0px;
    font-size: 14px;
    position: absolute;
    right: 0;
    bottom: 0;
}

.percentage {
    float: right;
    padding: 0 5px;
    font-weight: 600;
    color: #D00;
    font-size: 24px;
}

.discountInput {
    padding: 10px;
    border: 0;
    background: #FEE;
    border: 1px solid #DBB;
    float: right;
    height: 10px;
    margin: 0px;
    font-size: 18px;
}

.discountRow {
    padding: 15px;
    font-size: 18px;
    border-bottom: 1px solid #DBB;
}

.userHistoryTimeLarge {
    background: #FCC;
    color: #000;
    width: 300px;
    padding: 17px;
    margin-right: -20px;
    margin-top: -40px;
    font-size: 20px;
    float: right;
}

.userHistoryRow {
    border-bottom: 1px solid #DBB;
    margin: 10px 0;
    padding: 10px;
    position: relative;
}

.sidebarHeader {
    padding: 10px;
    background: #FFF;
    color: #D00;
    font-weight: 600;
    font-size: 16px;
}

.sidebarSearch {
    color: #D00;
    font-weight: 600;
    float: left;
    width: 17vw;
    padding: 15px;
    background: #FEE;
}

.historySearcher {
    width: calc(100% - 30px);
    border: 0;
    float: left;
    margin: 10px 0;
    padding: 10px;
}

    .historySearcher:nth-last-child(-n+2) {
        width: 50% !important;
    }

.historySearchButton {
    width: 38%;
    margin: 0.6vw 0 0 0.5vw;
    padding: 10px;
    float: left;
    display: block;
    border: 0;
    background: #FFF;
}

.historySidebarInner {
    padding: 20px;
    overflow-y: auto;
    width: calc(100% - 60px);
    height: calc(100vh - 400px);
}

.historyType {
    background: #FCC;
    float: left;
    width: 100%;
}

.historyTypeButton {
    width: 25%;
    float: left;
    border: 0;
    margin: 10px 4%;
    color: #D00;
    font-weight: 500;
    font-size: 16px;
    padding: 3% 0;
    background: #FFF;
}
/* toggle switches */

.switch {
    position: relative;
    display: inline-block;
    width: 56px;
    height: 30px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 22px;
        width: 22px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #D00;
}

input:focus + .slider {
    box-shadow: 0 0 1px #D00;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* profile */

.profileWidget {
    position: fixed;
    display: none;
    width: 400px;
    height: 540px;
    margin: 0;
    bottom: 20px;
    left: 20px;
    border: 1px solid #FCC;
    resize: both;
    background: #FFF;
    float: left;
    border-radius: 10px;
    z-index: 10;
    box-shadow: 10px 10px 8px rgba(0,0,0,0.35);
}

.profileRow {
    float: left;
    width: calc(100% - 40px);
    display: block;
    border-bottom: 1px solid #F00;
    padding: 20px;
}

.wideProfileButton {
    background: #D00;
    color: #FFF;
    margin-top: 100px;
    width: 100%;
    font-size: 20px;
    padding: 10px 20px;
    border: 0;
}

.profileButton {
    background: #D00;
    color: #FFF;
    padding: 10px 20px;
    border: 0;
}

.profileTitle {
    color: #D00;
    user-select: none;
    pointer-events: none;
    text-align: center;
    margin-top: 8px;
    float: left;
    font-size: 16px;
    font-weight: 600;
    border-radius: 10px;
    margin: 10px;
}

.profileWindow::-webkit-scrollbar {
    display: none;
}

.profileWidgetHeader {
    background: #FFF;
    border-bottom: 1px solid #D00;
    z-index: 11;
    cursor: move;
    border-radius: 7px 7px 0 0;
    height: 40px;
}
/* directory */

.directoryWidget {
    position: fixed;
    display: none;
    width: 400px;
    height: 540px;
    margin: 0;
    bottom: 20px;
    left: 20px;
    resize: both;
    background: #FFF;
    float: left;
    border: 1px solid #D00;
    z-index: 10;
    box-shadow: 10px 10px 8px rgba(0,0,0,0.35);
}

.directoryRolePicker {
    height: 37px;
    width: calc(100% - 10px);
    float: left;
    padding: 5px;
    display: flex;
    justify-content: space-evenly;
    background: #FEE;
    border-bottom: 3px solid #FCC;
}

.directoryRoleTab {
    border: 0;
    border-radius: 8px;
    min-width: 90px;
    background: #FFF;
    color: #A00;
    font-size: 14px;
    font-weight: 500;
    transition: 0.3s;
    line-height: 10px;
    padding: 10px;
}

    .directoryRoleTab:hover {
        background: #F99;
    }

.directoryRoleTabSelected {
    background: #FCC;
}

.directoryWindow {
    background: rgba(255,255,255,0.5);
    overflow-y: scroll;
    width: calc(100% - 60px);
    background: #FFF;
    height: 314px;
    padding: 5px;
    float: right;
}

.directoryIndex {
    width: 50px;
    height: 324px;
    overflow-y: scroll;
    overflow-x: hidden;
    float: left;
    background: #FEE;
}

.directoryFilter {
    height: 55px;
    background: #FFF;
}

.directorySearchInput {
    background: #FEE;
    width: 250px;
    border: 0;
    border-radius: 8px;
    padding: 0 10px;
    height: 36px;
    margin: 10px;
}


.directorySearchButton {
    background: #FFF;
    border: 1px solid #D00;
    width: 50px;
    border-radius: 8px;
    float: right;
    height: 36px;
    position: relative;
    margin: 10px;
}

    .directorySearchButton::before {
        content: '';
        display: block;
        background: #D00;
        width: 15px;
        height: 3px;
        transform: rotate(45deg);
        position: absolute;
        top: 11px;
        left: 20px;
    }

    .directorySearchButton::after {
        content: '';
        display: block;
        background: #D00;
        width: 15px;
        height: 3px;
        transform: rotate(135deg);
        position: absolute;
        top: 20px;
        left: 20px;
    }

.directoryTab {
    float: left;
    display: block;
    border: 0;
    width: 38px;
    height: 38px;
    font-size: 18px;
    color: #B00;
    background: #FFF;
    transition: 0.3s;
    border-radius: 8px;
    border: 1px solid #FCC;
    margin: 6px;
    position: relative;
}

    .directoryTab:hover {
        background: #F99;
    }

.directoryIndex::-webkit-scrollbar {
    display: none;
}


.directoryTitle {
    color: #D00;
    user-select: none;
    pointer-events: none;
    text-align: center;
    margin-top: 8px;
    float: left;
    font-size: 16px;
    font-weight: 600;
    border-radius: 10px;
    margin: 10px;
}

.directoryWindow::-webkit-scrollbar {
    display: none;
}

.directoryWidgetHeader {
    background: #FFF;
    z-index: 11;
    cursor: move;
    height: 40px;
    color: #D00;
}

    .directoryWidgetHeader:hover {
        background: #F66;
    }

.directoryWidgetHeaderButtons {
    margin-right: 10px;
}

.directoryRow {
    float: right;
    width: 100%;
    border-bottom: 1px solid #CCC;
}

.directoryCheck {
    margin: 8px;
    float: left;
}

.directoryRowName {
    padding: 4px;
    float: left;
}

.directoryButton {
    float: right;
    border: 0;
    background: #F00;
    width: 30px;
    height: 22px;
    border-radius: 8px;
    position: relative;
    margin: 5px;
}

    .directoryButton::before {
        content: '';
        display: block;
        background: #FFF;
        width: 7px;
        position: absolute;
        left: 12px;
        top: 8px;
        transform: rotate(45deg);
        height: 2px;
        float: left;
    }

    .directoryButton::after {
        content: '';
        display: block;
        background: #FFF;
        width: 7px;
        position: absolute;
        left: 12px;
        top: 12px;
        transform: rotate(135deg);
        height: 2px;
        float: left;
    }

.directoryControls {
    float: left;
    width: 100%;
    background: #FFF;
    height: 70px;
    background: #FAA;
    border-radius: 0 0 7px 7px;
    display: flex;
    justify-content: center;
}

.directoryControlButton {
    width: 55px;
    height: 55px;
    float: left;
    border: 0;
    border-radius: 10px;
    background: #FFF;
    border: 1px solid #FCC;
    margin: 7px;
    background-size: 70%;
    background-position: center;
    background-repeat: no-repeat;
}

.mailIcon {
    background-image: url("../assets/mailIcon.png");
}

.exportIcon {
    background-image: url("../assets/exportIcon.png");
}

.inviteIcon {
    background-image: url("../assets/inviteIcon.png");
}

.mapIcon {
    background-image: url("../assets/mapIcon.png");
}
/* calendar */
.calendar-event-tile {
    margin: 1px 0;
    font-size: 12px;
    border-radius: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border-left: 2px solid #D00;
    background-color: #FFF;
    padding: 5px;
    cursor: pointer;
    line-height: 1.2;
}

.calendarWidget {
    position: fixed;
    display: none;
    width: 400px;
    height: 430px;
    margin: 0;
    bottom: 20px;
    left: 20px;
    border: 1px solid #FCC;
    background: #FFF;
    float: left;
    box-shadow: 10px 10px 8px rgba(0,0,0,0.35);
    z-index: 10;
}

.calendarButtonContainer {
    position: relative;
    width: 90%;
    float: left;
}

.calendarHeader {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    background: #3762f6;
    color: #fff;
    padding: 10px;
}

.calendarHour {
    border: 1px solid #CCC;
    width: calc(100% + 40px);
    height: 30px;
    float: left;
}

.calendarWindow {
    background: rgba(255,255,255,0.5);
    overflow-y: scroll;
    width: calc(100% - 10px);
    background: #FFF;
    height: 320px;
    padding: 5px;
    float: left;
}

    .calendarWindow::-webkit-scrollbar {
        display: none;
    }

.calendarAdvanceButton {
    width: 36px;
    height: 36px;
    background-color: #FFF;
    float: left;
    display: block;
    border: 0px solid #FFF;
    background-size: 70%;
    background-position: center;
    position: relative;
    margin: 0;
    background-repeat: no-repeat;
}

    .calendarAdvanceButton::after {
        content: '';
        width: 2px;
        height: 15px;
        background: #D00;
        display: block;
        position: absolute;
        transform: rotate(135deg);
        top: 15px;
        right: 20px;
    }

    .calendarAdvanceButton::before {
        content: '';
        width: 2px;
        height: 15px;
        right: 20px;
        background: #D00;
        display: block;
        position: absolute;
        transform: rotate(45deg);
        top: 6px;
    }


.calendarControls {
    float: left;
    width: 100%;
    margin-top: 26px;
}

.calendarConfigButton {
    width: 65px;
    height: 36px;
    float: left;
    padding: 10px;
    line-height: 20px;
    display: block;
    border: 0px solid #FFF;
    background-color: #FFF;
    color: #D00;
}



.calendarAddButton {
    width: 50px;
    height: 36px;
    float: right;
    padding: 0 60px 0 10px;
    display: block;
    padding: 10px;
    line-height: 20px;
    text-align: center;
    text-align: left;
    border: 0px solid #FFF;
    background-color: #FFF;
    color: #D00;
}

.calendarHourLine {
    float: left;
    display: block;
    width: 100px;
    height: 100%;
    text-align: center;
    padding: 25px 0 0 0;
}

.calendarHourLineBlock {
    height: 31px;
}

.calendarTitle {
    color: #F00;
    user-select: none;
    pointer-events: none;
    text-align: center;
    margin-top: 8px;
    float: left;
    font-size: 16px;
    font-weight: 600;
    border-radius: 10px;
    margin: 10px;
}

.calendarLetterBlue {
    width: 6%;
    height: 4%;
    margin: 1%;
    border-right: 1px solid #FFF;
    color: #00F;
    padding: 5px 3%;
    float: left;
    transition: 0.3s;
    text-align: center;
    border-radius: 8px;
    font-weight: 700;
    background: #FFF;
    overflow: hidden;
}

.calendarLetter {
    width: 5.5%;
    height: 4%;
    margin: 1%;
    border-right: 1px solid #FFF;
    color: #F00;
    padding: 5px 3%;
    float: left;
    transition: 0.3s;
    text-align: center;
    border-radius: 8px;
    font-weight: 700;
    background: #FFF;
    overflow: hidden;
}

.pageLight {
    background: #FFF;
}

.pageDark {
    background: #FEE;
}

.pageBlue {
    background: #DDF;
}


.largeCalendarPage {
    width: 5.5%;
    height: 11%;
    border: 0px solid #FFF;
    color: #000;
    padding: 22px 6.5% 10px 2%;
    float: left;
    transition: 0.3s;
    font-weight: 500;
    font-size: 14px;
    overflow: hidden;
    border-right: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
}

.calendarPage:hover {
    background: #F66;
    color: #000;
}

.approvalContainer {
    padding: 20px;
    text-align: center;
}

.approvalHeader {
    margin-bottom: 20px;
    font-size: 1.4em;
}

.approvalDescription {
    margin-bottom: 30px;
}

.approvalButtons {
    display: flex;
    justify-content: center;
    gap: 20px;
}

.bkCandidateUploadContainer {
    padding: 10px;
    font-family: Arial, sans-serif;
}

.bkUploadInstructions {
    margin-bottom: 20px;
}

    .bkUploadInstructions ul {
        padding-left: 20px;
        margin-bottom: 20px;
    }

.bkUploadSection {
    margin: 20px 0;
    padding: 15px;
    border: 1px dashed #ccc;
    background: #f9f9f9;
    border-radius: 5px;
    float: left;
    width: calc(100% - 40px);
}

.bkUploadPrompt {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

#bkSelectedFileName {
    color: #666;
    margin-left: 10px;
}

.bkCsvPreview {
    margin-top: 15px;
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #eee;
    padding: 10px;
    background: white;
}

.bkPreviewTable {
    width: 100%;
    border-collapse: collapse;
}

    .bkPreviewTable th, .bkPreviewTable td {
        border: 1px solid #ddd;
        padding: 8px;
        text-align: left;
    }

    .bkPreviewTable th {
        background-color: #f2f2f2;
    }

.bkButtonSection {
    margin-top: 20px;
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.bkCancelButton {
    background-color: #f2f2f2;
    color: #333;
}

.bkUploadButton {
    background-color: #4CAF50;
    color: white;
}

    .bkUploadButton:disabled {
        background-color: #cccccc;
        cursor: not-allowed;
    }

.bkConfirmationContainer {
    padding: 10px;
}

.bkCandidateSummary {
    margin: 15px 0;
    padding: 10px;
    background: #f5f5f5;
    border-radius: 5px;
}

.bkConfirmationButtons {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 20px;
}

.bkLoadingContainer {
    padding: 20px;
    text-align: center;
}

.bkLoadingSpinner {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #3498db;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: bkSpinAnimation 2s linear infinite;
    margin: 20px auto;
}

@keyframes bkSpinAnimation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.approvalButton {
    padding: 10px 25px;
    font-size: 1.1em;
    cursor: pointer;
    border: none;
    border-radius: 4px;
}

.approveButton {
    background-color: #4CAF50;
    color: white;
}

.rejectButton {
    background-color: #f44336;
    color: white;
}

.largeCalendarPageDark {
    width: 6%;
    height: 8%;
    border: 0px solid #FFF;
    background: #FCC;
    color: #333;
    padding: 10px 4.5% 10px 4%;
    float: left;
    font-weight: 100;
    transition: 0.3s;
    font-size: 14px;
    overflow: hidden;
    border-right: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
}

.calendarSwitchButton {
    float: left;
    background: #fff;
    border: 1px #3762f6 solid;
    border-radius: 15px;
    color: #3762f6;
    padding: 10px;
    border: 0;
    margin: 10px;
    font-size: 16px;
}

    .calendarSwitchButton:nth-col(1n) {
        float: right;
    }

.calendarPage {
    width: calc(14.2% - 8px);
    height: 15%;
    border: 0px solid #CCC;
    color: #000;
    padding: 4px;
    float: left;
    transition: 0.3s;
    font-weight: 500;
    font-size: 14px;
    overflow: hidden;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    border-radius: 15px;
}

    .calendarPage:hover {
        background: #3762f6;
        color: #000;
    }

.calendarPageDark {
    width: calc(14.2% - 8px);
    height: 15%;
    border: 0px solid #FFF;
    background: #FCC;
    color: #333;
    padding: 4px;
    float: left;
    font-weight: 100;
    transition: 0.3s;
    font-size: 14px;
    overflow: hidden;
    border-right: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
}

.calendarPageDarkBlue {
    width: calc(14.2% - 8px);
    height: 15%;
    border: 0px solid #FFF;
    background: #88A;
    color: #333;
    padding: 4px;
    float: left;
    font-weight: 100;
    transition: 0.3s;
    font-size: 14px;
    overflow: hidden;
    border-right: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    border-radius: 15px;
}

.calendarPageDarkBlueEnd {
    width: calc(14.2% - 8px);
    height: 15%;
    border: 0px solid #FFF;
    background: #88A;
    color: #333;
    padding: 4px;
    float: left;
    font-weight: 100;
    transition: 0.3s;
    font-size: 14px;
    overflow: hidden;
    border-right: 1px solid #FFF;
    border-bottom: 1px solid #FFF;
    border-radius: 15px;
}


.calendarYearAdjust {
    position: absolute;
    height: 0px;
    width: 100%;
    overflow: hidden;
    padding: 0;
    transition: 0.5s;
}

.calendarEventRow {
    border-bottom: 1px solid #CCC;
    padding: 10px;
    width: 90%;
    font-weight: 600;
}

.calendarYear {
    font-weight: 600;
    color: #000;
    float: left !important;
    width: 60% !important;
    padding: 26px 0 10px 20px;
    text-align: center;
    font-size: 72px;
}

.calendarWidgetHeader {
    background: #FFF;
    z-index: 11;
    padding: 0;
    cursor: move;
    height: 40px;
}

    .calendarWidgetHeader:hover {
        background: #FEE;
    }

.headerButton {
    float: right;
    background: #FFF;
    border: 0;
    border-radius: 15px;
    height: 34px;
    width: 34px;
    margin: 2px 2px;
}

.calendarWidgetHeaderButtons {
    margin: 0;
    padding: 0;
}

.calendarButtonUp {
    background-image: url("../assets/buttonUp.png");
    width: 88px;
    height: 66px;
    background-color: #FCC;
    background-size: 60%;
    float: right;
    background-position: center;
    background-repeat: no-repeat;
    border: 0px solid #FFF;
    transition: 0.3s;
}

    .calendarButtonUp:hover {
        background-color: #F00;
    }


@keyframes urgencyCalendar {
    0% {
        background-color: #F00
    }

    50% {
        background-color: #F99
    }

    100% {
        background-color: #F00
    }
}


/*JL-C Hide debug window*/

.debugWindow {
    display: none;
}





/*Hub CSS*/



/*CRF CSS*/
.crfBlock {
    width: 85%;
    height: fit-content;
    min-height: 100px;
    margin: 10px auto;
    border-radius: 20px;
    background: #FFF;
    margin: 20px auto;
}

.crfAddressBlock {
    display: inline-block;
    width: 40%;
    height: 90%;
    min-height: 330px;
    margin: 10px auto;
    border: 1px solid #3762f6;
    border-radius: 20px;
    background: #FFF;
}

.crfCentreBlock {
    width: 40%;
    height: 90%;
    min-height: 330px;
    margin: 10px auto;
    border: 1px solid #3762f6;
    border-radius: 20px;
    background: #FFF;
}

.crfRowBlock {
    display: flex;
    width: 95%;
    margin: 20px auto;
}

.crfContactBlock {
    width: 85%;
    height: fit-content;
    min-height: 300px;
    border: 1px solid #3762f6;
    border-radius: 20px;
    background: #FFF;
    margin: 20px auto;
}

.crfTerms {
    font-size: 12px;
    margin-top: -15px;
}

.contactsContainer {
    width: 100%;
    height: 80%;
    margin: auto;
    margin-top: -10px;
}

.contact-group {
    width: 30%;
    height: 90%;
    margin: 10px;
    border: 1px solid #3762f6;
    border-radius: 20px;
    background: #FFF;
    float: none;
    display: inline-block;
}

.crfContactButton {
    float: none;
    display: block;
    border-radius: 20px;
    width: 40%;
    height: 30px;
    font-size: 20px;
    border: none;
    background: #3762f6;
    color: #FFF;
    margin: 10px auto;
}

.crfInput {
    float: none;
    display: block;
    border: 1px solid #000;
    background: #fff;
    border-radius: 20px;
    padding: 10px;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 85%;
    text-align: center;
}

.qualificationBlockHeader {
    font-size: 18px;
    font-weight: 400;
    text-align: center;
    margin: 10px auto;
}

.crfQualInput {
    display: inline-block;
    padding: 10px;
    background: #fff;
    border: 1px solid #3762f6;
}

.crfCentreTypeInput {
    display: inline-block;
    padding: 10px;
    background: #fff;
    border: 1px solid #3762f6;
}



.crfQualificationBlock {
    min-height: 300px;
    background: #FFF;
    border: 1px solid #3762f6;
}

.fundingDiv {
    width: 100%;
    margin: auto;
    display: block;
}

.fundingWrapper {
}

.fundingNoDiv {
    width: 40%;
    margin: auto;
    display: inline-block;
}

.fundingYesDiv {
    width: 40%;
    margin: auto;
    display: inline-block;
}



.crfQuestion {
    float: none;
    display: block;
    padding-bottom: 20px;
}

.crfLabel {
    float: none;
    display: block;
    text-align: center;
    margin: auto;
    margin-top: 10px;
    font-size: 20px;
    font-weight: 400;
}

.crfYesGovRadioBtn {
    width: 50px;
    height: 50px;
    margin: 10px auto;
    display: inline-block;
    border: 1px solid #000;
    background: #fff;
    border-radius: 20px;
    padding: 10px;
    vertical-align: middle;
}

.crfNoGovRadioBtn {
    width: 50px;
    height: 50px;
    margin: 10px auto;
    display: inline-block;
    border: 1px solid #000;
    background: #fff;
    border-radius: 20px;
    padding: 10px;
    vertical-align: middle;
}

.crfyesLabel {
    height: 50px;
    width: auto;
    margin: 10px auto;
    margin-top: 10px;
    margin-left: auto;
    font-size: 20px;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    margin-top: 30px;
    vertical-align: middle;
    margin-left: 20px;
}

.crfnoLabel {
    height: 50px;
    width: auto;
    margin: 10px auto;
    margin-top: 10px;
    margin-left: auto;
    font-size: 20px;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    margin-top: 30px;
    vertical-align: middle;
    margin-left: 20px;
}

.crfHeader {
    font-size: 18px;
    float: none;
    display: block;
}


.crfButton {
    float: none;
    display: block;
    border-radius: 20px;
    width: 60%;
    margin: 0 auto;
}

.crfSectionQuestion {
    border: 1px solid #3762f6;
    border-radius: 15px;
    height: fit-content;
    float: none;
    display: block;
    margin-bottom: 10px;
}

.crfSection {
    float: none;
    display: block;
    margin-bottom: 10px;
}

.crfNameLabel {
    margin-top: 20px;
}

.crfNameInput {
    padding: 20px;
    margin-top: 20px;
}

.crfWebsiteLabel {
    margin-top: 20px;
}

.crfWebsiteInput {
    padding: 20px;
    margin-top: 20px;
}

.crfAddressHeader {
}

.crfaddressLine1Input {
}

.crfaddressLine2Input {
}

.crfaddressLine3Input {
    width: 40%;
    display: inline-block;
    margin: 10px;
}

.crfaddressLine4Input {
    width: 40%;
    display: inline-block;
    margin: 10px;
}

.crfcityInput {
    width: 40%;
    display: inline-block;
    margin: 10px;
}

.crfpostcodeInput {
    width: 40%;
    display: inline-block;
    margin: 10px;
}

.crfcountyInput {
    width: 40%;
    display: inline-block;
    margin: 10px;
}

.crfcountryInput {
}

.centreTypeDiv {
    width: 40%;
    display: inline-block;
}

.qualificationTypeDiv {
    width: 40%;
    display: inline-block;
}

.crfSubmitSection {
    min-height: fit-content;
    height: 150px;
}

.crfTextInput {
}

.crfQuestionLabel {
    height: 50px;
    margin: 10px auto;
    font-size: 20px;
    font-weight: 400;
    display: inline-block;
    text-align: center;
    margin-top: 30px;
    vertical-align: middle;
    margin-left: 20px;
}


.crfRadioInput {
    width: 50px;
    height: 50px;
    margin: 10px auto;
    display: inline-block;
    border: 1px solid #000;
    background: #fff;
    border-radius: 20px;
    padding: 10px;
    vertical-align: middle;
}

.crfCheckInput {
    float: right;
    width: 50px;
    height: 50px;
    margin: 10px auto;
    display: block;
    border: 1px solid #000;
    background: #fff;
    border-radius: 20px;
    padding: 10px;
    margin: 20px 150px 10px 0px;
}

.crfGroupInput {
}

.crfCheckGroupInput {
    float: right;
    width: 50px;
    height: 50px;
    margin: auto;
    padding: 0;
}

.crfGroupCheckDiv {
    width: 80%;
    height: 75px;
    margin: auto;
}

.radioDiv {
    width: 40%;
    margin: auto;
    display: inline-block;
}

.crfSubmitButton {
    height: 50%;
    width: 60%;
    margin: auto;
    background: #3762f6;
    color: #FFF;
    font-size: 22px;
}

    .crfSubmitButton:hover {
        border: 1px solid #3762f6;
        color: #3762f6;
        background: #FFf;
        font-size: 22px;
    }


/*CRF CSS*/


.hubHead {
}



.hubNavigation {
    float: left;
    position: absolute;
    top: 0;
    left: 0;
    background: #FFF;
    z-index: 1;
    width: 15vw;
    min-width: 300px;
}



.hubSideBar {
    display: block;
    border-right: 1px solid #CCC;
    text-align: center;
    height: 95vh;
}



.hublogo {
    margin: 25px auto;
    float: none;
    width: 80px;
}



.hubNavButton {
    height: 50px;
    width: 80%;
    margin: auto auto 8px auto;
    padding: 10px 20px 10px 20px;
    background: none;
    border: none;
    border-radius: 15px;
    font-size: 15px;
    font-weight: 600;
    color: grey;
}

    .hubNavButton:hover {
        color: #004896;
    }



    .hubNavButton:active {
        background-color: rgba(0,72,150,.08);
    }





.hubMasterButton {
    height: 50px;
    width: 80%;
    margin: auto;
    padding: 10px 20px 10px 20px;
    background: #3762f6;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
}



    .hubMasterButton:hover {
        transform: scale(1.05);
        perspective: 10px;
        transition: 0.25s;
    }





.hubBanner {
    float: right;
    background-color: #3762f6;
    height: 100px;
    width: 85vw;
    height: 15vh;
    max-height: 144px;
    max-width: calc(100vw - 300px);
}



    .hubBanner h2 {
        color: #FFF;
        margin: 40px 0 10px 20px;
        font-size: 36px;
    }

.hubBannerYellow {
    background: #DD0;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    padding: 20px;
    margin: 10px 0;
}


.signOutIcon {
    position: absolute;
    top: 60px;
    right: 50px;
    fill: #FFF;
    margin-left: 1em;
    width: 1.4em;
    height: 1.4em;
    transform: translateX(0);
    transition: .1s ease transform;
}



.hubBody {
}



.hubBookingOptionsContainer {
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    background: #f8f8f8;
    transform: translateX(0%);
}



.hubBookingOptionsHalfWidth {
    margin-left: 25px;
    margin-top: 20px;
    display: inline-block;
    vertical-align: middle;
    height: 25vh;
    width: calc(50% - 50px);
    border-radius: 5px;
    border: 1px solid #ccc;
    background: #FFF;
    position: relative;
}



    .hubBookingOptionsHalfWidth:hover {
        border: 1px solid #000;
    }



    .hubBookingOptionsHalfWidth h2 {
        margin: 20px;
        font-weight: 500;
    }



.hubBookingOptions ul li {
    margin: 10px;
}



.hubOptionLink {
    position: absolute;
    bottom: 0;
    width: 100%;
    border-top: 1px solid #CCC;
}



.hubLinkContent {
    float: right;
    margin: 10px;
}



.hubBookingOptionsThirdWidth {
    margin: 20px 0 0 24px;
    display: inline-block;
    vertical-align: middle;
    height: 25vh;
    width: calc(33% - 40px);
    border-radius: 5px;
    border: 1px solid #ccc;
    background: #FFF;
    position: relative;
}



    .hubBookingOptionsThirdWidth:hover {
        border: 1px solid #000;
        filter: opacity(2px);
    }



    .hubBookingOptionsThirdWidth h2 {
        margin: 20px;
        font-weight: 500;
    }



.bookingSchedule {
    margin: auto;
}



.scheduleControls {
    width: 80vw;
    margin: auto;
    border: 1px solid #CCC;
}

    .scheduleControls h3 {
        display: inline-block;
        vertical-align: middle;
        position: relative;
    }

.assessorCalendarButton {
    margin: 10px 10px 10px 10px;
    padding: 10px;
    display: inline-block;
    vertical-align: middle;
    height: 5vh;
    border-radius: 5px;
    border: 1px solid #ccc;
    background: #FFF;
    position: relative;
    text-align: center;
}

.assessorCalendarButtonalt {
    margin: 10px 10px 10px 10px;
    padding: 10px;
    display: inline-block;
    vertical-align: middle;
    height: 5vh;
    border-radius: 5px;
    border: 1px solid #ccc;
    background: #FFF;
    position: relative;
    text-align: center;
}


.columnThirdWidth {
    width: 33%;
    display: inline-block;
    vertical-align: middle;
}

.keyInfo{
    float:left;
    width:40%;
    padding:20px;
}
.cxNotice{
    float:left;
    margin-top:-70px;
    width:35%;
    font-size:16px;
    text-align:left;
}
.cxNoticeLarge {
    float: left;
    margin:-20px 0 20px 0;
    background:#33F;
    color:#FFF;
    padding:10px 0;
    width: 100%;
    font-size: 16px;
    text-align: center;
}
.filterButton{
    padding:10px;
    background:#D00;
    color:#FFF;
    border:0;
    font-size:18px;
    width:100px;
    float:left;
    display:block;
}
.qualificatonSelection {
    text-align: center;
    display: inline-block;
    transition: opacity 0.4s ease, transform 0.4s ease;
    width: 63vw;
    height: calc(100vh - 170px);
    overflow-x: hidden;
    transform: translateX(250%);
    top: 0px;
    left: 0px;
    position: absolute;
    overflow-y: scroll;
    padding-top: 20px;
    vertical-align: top;
    margin-bottom: 100px;
    border-right: 1px solid #CCC;
}



.qualificationList {
    transform: translateX(150%);
    height: calc(85vh - 254px);
    overflow-y: scroll;
}

.termsConditionsBox {
    border: 1px solid #CCC;
    border-radius: 20px;
    float: left;
    display:none;
    width:calc(100% - 40px);
    margin: 20px;
    padding: 20px 0;
}

.termsConditionsInner {
    text-align: left;
    float: left;
    margin: 20px;
}

.qualificationFilter {
    width: 100%;
    margin: auto;
    text-align: center;
}

.filterOptionsContainer {
    display: none;
    border: 1px solid #3762f6;
    border-radius: 15px;
    width: 90%;
    height: 200px;
    background: #3762f6;
    backdrop-filter: opacity(0.5);
    margin: auto;
}



.searchQualifications {
    height: 50px;
    border-radius: 15px;
    width: 70%;
    padding: 5px;
    border: 1px solid #3762f6;
    box-shadow: #ccc 2px 2px 5px;
    vertical-align: middle;
    display: inline;
}

.hubFilterButton {
    display: inline;
    background: #3762f6;
    color: #FFF;
    border: 0;
    vertical-align: middle;
    padding: 20px 40px;
    font-weight: 900;
    border-radius: 10px;
    font-size: 16px;
}

    .hubFilterButton:hover {
        transition: 0.5s;
        background: #FFF;
        color: #3762f6;
        border: 1px solid #3762f6;
        padding: 20px 40px;
        font-weight: 900;
        border-radius: 10px;
        font-size: 16px;
    }



.qualificationContiner {
    display: inline-block;
    vertical-align: middle;
    border: 1px solid #CCC;
    border-radius: 25px;
    height: 200px;
    width: 29%;
    margin: 10px;
    position: relative;
    box-shadow: #ccc 2px 2px 5px;
}



    .qualificationContiner h2 {
        text-align: left;
        float: left;
        font-size: 16PX;
        padding: 10px;
        font-weight: 500;
        margin-top: -5px;
    }



    .qualificationContiner h3 {
        float: left;
        font-size: 14PX;
        margin-top: -30px;
        font-weight: 500;
        padding: 10px;
    }





    .qualificationContiner.selected {
        border: 2px solid #3762f6;
    }






.selectionDiv {
    position: absolute;
    height: 50px;
    bottom: 0;
    width: 100%;
    border-top: 1px solid #CCC;
}



    .selectionDiv i {
        display: inline-block;
        margin-left: -3px;
    }



    .selectionDiv h4 {
        margin-top: 30px;
        display: inline-block;
    }



.quallinkContent {
    float: right;
    margin-right: 10px;
    margin-top: -15px;
    font-family: Tahoma;
    color: rgb(217, 49, 44);
}

.moreDetails {
    float: left;
    padding: 5px;
    margin: 10px;
    margin-top: 10px;
    background: none;
    border: none;
    z-index: 999;
    text-decoration: underline;
}

    .moreDetails:hover {
        color: #D00;
    }




.bookingCategory {
    transform: translateX(250%);
    display: inline-block;
    transition: opacity 0.4s ease, transform 0.4s ease;
    width: 100%;
    height: calc(100vh - 110px);
    position: absolute;
    overflow: scroll;
    padding-top: 20px;
    vertical-align: top;
    background: #FAFAFA;
    margin-bottom: 100px;
    border-right: 1px solid #CCC;
    top: 0;
    left: 0;
    text-align: center;
}

.bookingCategoryHeader {
    background: #FFF;
    margin: 25px;
    border: 1px solid #DDD;
    text-align: center;
    font-weight: 900;
    padding: 20px;
}

.hubContent {
    position: absolute;
    right: 0;
    top: 10vh;
    width: 85vw;
    height: 85vh;
    max-width: calc(100vw - 300px);
    overflow: hidden;
}

.assessorhubContent {
    position: absolute;
    right: 0;
    top: 10vh;
    width: 85vw;
    height: 100vh;
    max-width: calc(100vw - 300px);
    overflow: hidden;
}

.hubBookingBox {
    background: #FFF;
    margin: 25px;
    border: 1px solid #DDD;
    padding: 20px;
    font-size: 18px;
}

.hubSessionBox {
    background: #FFF;
    margin: 30px 0 100px 0;
    border-width: 1px 0;
    font-size: 18px;
    line-height: 24px;
    border-style: solid;
    border-color: #DDD;
    padding: 20px 0;
}

.hubProgressHeader {
    margin: 0 40px 10px 0;
    font-weight: 600;
}

#progressIndicator {
    height: 120px;
    float: left;
    display: block;
    width: 60vw;
}

.hubProgressLine {
    position: absolute;
    top: 20px;
    right: -50%;
    margin: 60px 0;
    width: 100%;
    height: 4px;
    background-color: #0D0;
}

.hubProgressCircle {
    width: 20px;
    height: 20px;
    z-index: 2;
    position: absolute;
    right: 50%;
    border-radius: 50%;
    background-color: white;
    border: 10px solid white;
    margin: 10px auto;
    box-shadow: 0 0 0 2px #0D0;
}

.hubQualSelector {
    padding: 20px;
    float: left;
    text-align: center;
    border-bottom: 1px solid #CCC;
    font-weight: 600;
    font-size: 18px;
    width:calc(100% - 40px);
}
.rr-section-controls{
    float:left;
}
.subSessionDateSelector {
    padding: 10px;
    font-size: 36px;
    margin: 20px auto;
    display: block;
    border: #3762f6 1px solid;
    border-radius: 15px;
    width: 40%;
    text-align: center;
}

.hubSessionBoxInner {
    font-weight: 900;
    font-size: 18px;
}

.hubSessionQualBox {
    font-weight: 400;
    font-size: 14px;
    margin: 10px 0;
}

.hubBookingImage {
    width: 400px;
    height: 320px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin: 30px auto;
    display: block;
    background-image: url(data:image/png;base64,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);
}

.hubVenueSelect {
    padding: 10px 20px;
    font-size: 18px;
    width: 30vw;
    min-width: 300px;
}

.hubContinueButton {
    background: #3762f6;
    color: #FFF;
    float: right;
    border: 0;
    margin-top: -60px;
    padding: 20px 40px;
    font-weight: 900;
    border-radius: 10px;
    font-size: 16px;
}

.selectedList {
    display: block;
    float: right;
    width: 23.5vw;
    vertical-align: top;
    text-align: center;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
}



    .selectedList h2 {
        font-family: Tahoma;
        font-weight: 600;
        color: grey;
        font-size: 22px;
    }



.nextBookingStageButtons {
    display: inline-block;
    transform: translateX(150%);
    width: 100%;
    margin-top: 10px;
}



.QualStageButton {
    display: inline-block;
    height: 50px;
    width: 40%;
    margin: auto;
    margin-top: 10px;
    background: #3762f6;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
}

.centeredButton {
    display: inline-block;
    height: 50px;
    width: 20%;
    margin: 40px 40%;
    background: #3762f6;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
}

.QualStageButtonalt {
    display: inline-block;
    height: 50px;
    width: 40%;
    margin: auto;
    background: #dd0000;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
}

.crfContainer {
    transform: translate(250%);
}

.hubFilterButton {
    height: 60px;
    width: 20%;
    margin: 5px auto;
    background: #3762f6;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #FFF;
    padding: 5px;
    padding-bottom: 10px;
}

    .hubFilterButton:hover {
        color: #3762f6;
        background: #FFF;
        transition: 0.5s;
        border: 1px solid #3762f6;
    }

.selectedList {
    width: 25%;
    position: sticky;
    top: 0px;
    float: right;
    margin-top: -180vh;
    text-align: center;
    height: calc(100vh - 350px) !important;
    transform: translate(250%);
}

.hubMobilelogo {
    display: none;
}

.qualificationFilterButtons {
}

.hubNavIcon {
    display: none;
}

.qualificationFilterButtons {
    border-radius: 25px;
    background-color: #
}



.qualListContent {
    margin: auto;
    padding: 10px;
    border-bottom: 1px solid #ccc;
}

.reversed {
    transform: rotate(180deg);
    float: right !important;
}

.reversedNoFloat {
    transform: rotate(180deg);
}

.assessorCalendarButton {
}

.assessorCalendarButtonalt {
}

.centreDetails {
    transition: opacity 0.4s ease, transform 0.4s ease;
    display: inline-block;
    width: 100%;
    height: 100%;
    background: #f8f8f8;
    transform: translateX(250%);
    position: absolute;
    left: 0px;
    top: 0px;
    text-align: center;
    overflow-y: scroll;
}

.lowProfileButton {
    display: inline-block;
    height: 40px;
    width: 150px;
    margin: 10px;
    background: #FFF;
    border: none;
    border-radius: 15px;
    font-size: 18px;
    font-weight: 600;
    color: #3762f6;
    border: 1px #3762f6 solid;
}

.loginFieldNames {
    font-size: 16px;
    float: left;
    text-align: left;
}

.loginText {
    font-size: 22px;
    color: #999;
    text-align: left;
    padding-left: 10px;
}

.invitationStatusBox {
    float: left;
    margin-left: 10px;
}

/* Array Management Styles */
.arrayContainer {
    width: calc(100% - 20px);
    float: left;
    margin: 10px 0;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #f9f9f9;
    padding: 10px;
}

.arrayItem {
    margin: 10px 0;
    padding: 15px;
    float: left;
    display: block;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #ffffff;
    position: relative;
}

    .arrayItem h4 {
        margin: 0 0 10px 0;
        color: #333;
        font-size: 16px;
        font-weight: 600;
    }

.arrayItemFields {
    margin-top: 10px;
}

.bookingRow {
    background: #fff;
    border: 1px solid #3762f6;
    border-radius: 10px;
    margin: 10px 0;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

    .bookingRow:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 8px rgba(0,0,0,0.15);
        border-color: #2548d8;
    }

.bookingRowContent {
    flex: 1;
}

.bookingRowTitle {
    font-size: 18px;
    font-weight: 600;
    color: #3762f6;
    margin-bottom: 5px;
}

.bookingRowDate {
    font-size: 16px;
    color: #666;
    margin-bottom: 3px;
}

.bookingRowLocation {
    font-size: 14px;
    color: #888;
}

.bookingRowActions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.bookingRowButton {
    background: #3762f6;
    color: white;
    border: none;
    padding: 8px 16px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    transition: background 0.2s ease;
}

    .bookingRowButton:hover {
        background: #2548d8;
    }

    .bookingRowButton.secondary {
        background: #fff;
        color: #3762f6;
        border: 1px solid #3762f6;
    }

        .bookingRowButton.secondary:hover {
            background: #f0f4ff;
        }

.bookingRowStatus {
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
}

.assessorReportSectionComment {
    float: left;
    height: max-content;
}

.sectionCommentField {
    float: left;
    border: 1px solid #D00;
    margin: 10px;
    resize: none;
}

.statusConfirmed {
    background: #e8f5e8;
    color: #2d5a2d;
}

.statusPending {
    background: #fff3cd;
    color: #856404;
}

.statusCancelled {
    background: #f8d7da;
    color: #721c24;
}

.noBookingsMessage {
    text-align: center;
    padding: 40px 20px;
    color: #666;
    font-size: 16px;
    background: #f9f9f9;
    border-radius: 10px;
    margin: 20px 0;
}

.arrayRemoveButton {
    background: #dc3545;
    color: #fff;
    border: none;
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 12px;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 10px;
}

    .arrayRemoveButton:hover {
        background: #c82333;
    }

.sessionRowDiv {
    border-radius: 15px;
    margin-top: 120px;
}


.hubReviewDiv {
    display: none;
    width: 90%;
    height: 200px;
    border: 1px solid #CCC;
    border-radius: 15px;
    margin: auto;
    margin-bottom: 10px;
}

.hubselectedDay {
    background-color: #3762f6;
}

@media only screen and (max-width: 850px) {
    .content {
        height: 1650px;
    }

    .hubHead {
    }

    .hubBanner {
        width: 100%;
        max-width: 100%;
        max-height: 200px;
        height: 10vh;
        min-height: 25px;
        max-height: 50px;
    }

        .hubBanner h2 {
            float: left;
            top: 0;
            left: 0;
            position: fixed;
            font-size: 15px;
            margin: 10px auto;
        }

    .hubMobilelogo {
        height: 60px;
        width: 60px;
    }

    .signOutIcon {
        height: 20px;
        width: 20px;
        float: right;
        margin: 10px 10px 10px 10px;
        position: inherit;
    }


    .hubNavigation {
        position: fixed;
        bottom: 0;
        top: auto;
        left: auto;
        width: 100%;
        max-width: auto;
        max-height: 80px;
        height: 75px;
    }

    .hubSideBar {
        margin-top: 10px;
        height: 80px;
        position: sticky;
        bottom: 0;
    }

    .hublogo {
        display: none;
    }

    .mobilehublogo {
        width: 80px;
    }

    .hubNavIcon {
        margin: auto;
        float: none;
    }

    .hubNavButton {
        display: inline-block;
        height: 60px;
        width: 60px;
        font-size: 12px;
        vertical-align: central;
        text-wrap: balance;
        flex: 0 0 80px;
        height: 100%;
        /*margin: 1vw;*/
        padding: 0;
        list-style: none;
        margin-top: 0;
    }

    .historySidebar {
    }

    .hubContent {
        overflow-y: scroll;
        position: inherit;
        width: 100%;
        max-width: 100%;
        height: calc(100vh - 120px);
    }

    .assessorhubContent {
        overflow-y: scroll;
        position: inherit;
        width: 100%;
        max-width: 100%;
        height: calc(100vh - 120px);
    }

    .crfRowBlock {
        display: block;
        width: 95%;
        margin: 20px auto;
    }

    .crfCentreBlock {
        width: auto;
    }

    .crfAddressBlock {
        width: auto;
    }


    .hubNavButton:hover {
    }



    .hubNavButton:active {
    }





    .hubMasterButton {
        margin-top: 10px;
        height: 60px;
        width: 60px;
    }



        .hubMasterButton:hover {
        }







    .hubBannerYellow {
    }

    .hubBody {
    }



    .hubBookingOptionsContainer {
        overflow-y: scroll;
        max-width: auto;
    }



    .hubBookingOptionsHalfWidth {
        width: 80%;
        display: block;
        margin: 10px auto;
    }



        .hubBookingOptionsHalfWidth:hover {
        }



        .hubBookingOptionsHalfWidth h2 {
        }



    .hubBookingOptions ul li {
    }



    .hubOptionLink {
    }



    .hubLinkContent {
    }



    .hubBookingOptionsThirdWidth {
        width: 80%;
        display: block;
        margin: 10px auto;
    }



        .hubBookingOptionsThirdWidth:hover {
        }



        .hubBookingOptionsThirdWidth h2 {
        }



    .bookingSchedule {
    }



    .scheduleControls {
    }




        .scheduleControls h3 {
        }



    .columnThirdWidth {
    }



    .qualificatonSelection {
    }



    .qualificationList {
    }



    .qualificationFilter {
    }



    .searchQualifications {
    }





    .qualificationContiner {
    }



        .qualificationContiner h2 {
        }



        .qualificationContiner h3 {
        }

        .qualificationContiner.selected {
        }

    .selectionDiv {
    }



        .selectionDiv i {
        }



        .selectionDiv h4 {
        }



    .quallinkContent {
    }




    .bookingCategory {
        top: 50px;
    }

    .bookingCategoryHeader {
    }

    .hubBookingBox {
    }

    .hubSessionBox {
    }

    .hubSessionBoxInner {
    }

    .hubSessionQualBox {
    }

    .hubContinueButton {
    }

    .selectedList {
    }



        .selectedList h2 {
        }



    .nextBookingStageButtons {
    }



    .QualStageButton {
    }



    .QualStageButtonalt {
    }



    .qualListContent {
    }

    .reversed {
    }

    .reversedNoFloat {
    }


    .crfContainer {
    }


    .qualificationFilterButtons {
    }

    .columnThirdWidth {
        width: 30%;
        /*display: inline-block;*/
        vertical-align: middle;
        padding: 1%;
    }

    .assessorCalendarButton {
        display: none;
    }

    .assessorCalendarButtonalt {
    }

    .organiserButtons {
        margin-top: 20px;
    }
}

@media only screen and (max-width: 400px) {

    .content {
        top: 0px;
        height: 109%;
        max-height: 1650px;
        overflow: hidden;
        width: 109%;
    }
}
